WordPress'te Uyarı Kutuları Nasıl Oluşturulur

Yayınlanan: 2023-02-12

Web siteniz çok sayıda ziyaretçi alıyorsa ancak kayıtlar veya dönüşümler istediğinizden düşükse, yalnız değilsiniz. Trafiğinizi artırmanıza yardımcı olacak tonlarca kaynak var, ancak bu trafiğin sitenizde doğru işlemleri yapmasını sağlamak başka bir hikaye.

Olası bir çözüm, bir uyarı kutusu kullanmaktır. Bu, WordPress sitenizdeki dönüşümleri önemli ölçüde artırabilen güçlü ve basit bir araçtır. Üstelik bu özelliği oluşturmak ve özelleştirmek çok kolay.

İçindekiler
1. Uyarı Kutusu Nedir?
2. Neden Bir Uyarı Kutusu Oluşturmalısınız?
3. Eklenti İle Uyarı Kutusu Oluşturma
3.1. 1. Adım: Bir Eklenti İndirin (Popup Maker gibi)
3.2. 2. Adım: Bir Açılır Pencere Oluşturun
3.3. 3. Adım: Açılır Pencereniz için Tetikleyicileri Yapılandırın
3.4. 4. Adım: Uyarı Kutunuzun Stilini Oluşturun
4. Eklenti Olmadan Bir Uyarı Kutusu Oluşturma
4.1. 1. Adım: header.php Dosyanızı Düzenleyin
4.2. 2. Adım: Özel CSS Ekleyin
5. Sitenizi WP Engine ile Geliştirin

Bu yazıda, bir uyarı kutusunun ne olduğunu ve neden kullanmanız gerektiğini ele alacağız. Ardından, WordPress'te kendi uyarı kutunuzu nasıl oluşturacağınızı göstereceğiz. Haydi dalalım!

Uyarı Kutusu Nedir?

Bir uyarı kutusu tam olarak göründüğü gibidir. Ziyaretçilere bir şey olduğunu bildirmek için bir web sitesinde görünen bir uyarıdır. Bu özelliği bir 'açılır pencere' olarak daha iyi biliyor olabilirsiniz.

WordPress'teki uyarı kutuları genellikle iki biçimden birini alır. Ekranda görünen bir açılır pencere veya sayfanızın üst kısmında uzanan bir çubuk (bazen 'merhaba çubuğu' olarak adlandırılır) görebilirsiniz.

Neden Bir Uyarı Kutusu Oluşturmalısınız?

Uyarı kutuları, genellikle sitenizde meydana gelen önemli bir şeyi kullanıcılara bildirmek (veya uyarmak) için kullanılır. Örneğin, ziyaretçilere başka türlü göremeyecekleri bir ürünle ilgili özel bir indirim veya bir dizi öne çıkan gönderi hakkında bilgi vermek için bir WordPress uyarı kutusu kullanabilirsiniz.

Bu özelliğin çok yaygın bir başka kullanımı da ziyaretçi e-posta adreslerini yakalamaktır. Birçok WordPress uyarı kutusu eklentisi, bir kullanıcı imlecini siteden uzaklaştırdığında (örneğin, sekmeyi kapatmak veya geri düğmesine basmak için) açılacak şekilde ayarlanabilir.

Bu 'son dakika' uyarıları, ziyaretçilerin iletişim bilgilerini ayrılmadan önce yakalamanın harika bir yolu olabilir ve potansiyel olarak yolda bir dönüşümle sonuçlanabilir. Bu uyarılar son derece etkili olabilir - en iyi performans gösteren açılır pencerelerin dönüşüm oranı yüzde 9'un üzerindedir. Başka bir deyişle, uygulama çabasına fazlasıyla değer.

Eklenti İle Uyarı Kutusu Oluşturma

WordPress eklentileri sayesinde kendi uyarı kutularınızı oluşturmak basittir. Güçlü (ve ücretsiz) Popup Maker eklentisini kullanarak her adımda size yol göstereceğiz.

1. Adım: Bir Eklenti İndirin (Popup Maker gibi)

Yapmanız gereken ilk şey, özel bir eklenti almak. Yukarıda belirttiğimiz gibi, ücretsiz Popup Maker eklentisi iyi incelenmiş ve sağlam bir seçimdir.

Bu aracı yüklemek için WordPress kontrol panelinize gidin ve Eklentiler > Yeni Ekle seçeneğine gidin. "Açılır pencere yapıcı"yı arayın ve ilk giriş bu olmalıdır:

WordPress'te açılır pencere oluşturucu eklentisi ekleyin

Ardından Şimdi Yükle'ye tıklayın. Kurulum bittiğinde, Activate öğesini seçerek eklentiyi etkinleştirmeyi unutmayın. Popup Maker'ın kendisi ücretsiz olsa da, bazı özelliklerin kullanılması için premium bir plan gerektiğini unutmayın.

2. Adım: Bir Açılır Pencere Oluşturun

Popup Maker yüklendiğinde, WordPress kenar çubuğunuzda eklentinin adını taşıyan yeni bir giriş görmelisiniz . Tüm açılır pencerelerinizin bir listesini açmak için tıklayın. İlk başta boş olacak, ama bunu düzeltmek üzeresiniz.

Bir açılır pencere oluşturmak için, ekranın üst kısmındaki Yeni Açılır Pencere Ekle'ye tıklayın. Bu, WordPress editörünü açacaktır:

WordPress'te yeni açılır pencere ekle

Bu ekranı ziyaret ettiğinizde, nasıl pop-up oluşturacağınızı gösteren bir öğretici görünecektir. Yapmanız istenen ilk şey, açılır pencereyi daha sonra tanımlayabilmeniz için bir ad girmenizdir.

Bundan sonra, açılır pencerede başlık olarak görünecek isteğe bağlı bir başlık girebilirsiniz. Ana düzenleyici alanında, açılır pencerede görüntülemek istediğiniz içeriği de girebilirsiniz. Yalnızca basit bir iletişim formu oluşturmak istiyorsanız önceden tanımlanmış bir kısa kod da kullanabilirsiniz.

Bu kısa kodlar, araç çubuğunda Popup Maker logolu yeni bir düğmenin altında bulunur:

Popup oluşturucu kısa kodları WordPress

E-postaları yakalamak için temel bir iletişim formu eklemek için Abonelik Formu'nu tıklayın. Alanlar ve gizlilik sorumluluk reddi beyanı için metin, forma tıklanarak ve düzenle düğmesi seçilerek özelleştirilebilir. Metne ek olarak, stiller ve düzen için bir dizi seçenek vardır.

3. Adım: Açılır Pencereniz için Tetikleyicileri Yapılandırın

Açılır formunuz oluşturulduğunda, sonraki adım tetikleyicilerini yapılandırmaktır. Bunlar, uyarı kutusunun ne zaman görüneceğini belirler.

Açılır düzenleyici ekranında, Açılır Pencere Ayarları'na gidin ve listeden Tetikleyiciler'i seçin. Ardından Yeni Tetikleyici Ekle'ye tıklayın:

WordPress'te yeni bir açılır pencere tetikleyicisi ekleyin

Temel Popup Maker eklentisi burada üç seçenek içerir: Open , Time Delay/Auto Open ve Form Submission tıklayın. Premium plan kullanıyorsanız tetikleyici olarak Çıkış Amacı'nı da seçebilirsiniz - bu, bir kullanıcı sitenizden ayrılmaya çalıştığında açılır pencerenin görünmesini istiyorsanız kullanabileceğiniz seçenektir.

Hedefleme sekmesi altında uyarı kutusunun hangi sayfalarda görüneceğini de ayarlayabilirsiniz. Belirli sayfaların veya cihaz türlerinin uyarıyı görmesini engellemek istiyorsanız bu ayarı özelleştirdiğinizden emin olun.

4. Adım: Uyarı Kutunuzun Stilini Oluşturun

Son olarak, sitenizin temasına daha iyi uyması için yeni uyarı kutunuzun görünümünü değiştirebilirsiniz. Açılır Pencere Ayarları alanında, Görüntü öğesini seçin. Orada, açılır pencerenin ekranda göründüğü yeri (üst çubuk dahil) değiştirebilir, boyutunu ve konumunu ayarlayabilir ve mevcut birkaç temadan birini seçebilirsiniz:

Özel stil uyarı kutusu wordpress

İşiniz bittiğinde, değişikliklerinizi kaydetmek ve açılır pencerenizi etkinleştirmek için Yayınla düğmesini seçtiğinizden emin olun.

Eklenti Olmadan Uyarı Kutusu Oluşturma

Bir eklenti kullanmamayı tercih ederseniz, biraz kod ve biraz dirsek yağı kullanarak kendiniz de bir uyarı kutusu oluşturabilirsiniz. Header.php dosyanızı düzenlemeniz ve sitenize biraz CSS eklemeniz gerekecek. Bu örnek için, sayfanın üst kısmında bir uyarı çubuğu oluşturacağız.

1. Adım: header.php Dosyanızı Düzenleyin

Yapmanız gereken ilk şey, header.php dosyanıza bazı kodlar eklemektir. Buna WordPress Tema Düzenleyici kullanılarak erişilebilir. Kontrol panelinizden Görünüm > Tema Düzenleyici bölümüne gidin. Ardından sağdaki kenar çubuğundan Tema Başlığı'nı (header.php) seçin:

WordPress'te başlık PHP dosyasına kod nasıl eklenir

Aşağıdaki kodu kopyalayıp <head> bölümünün sonundaki dosyaya yapıştırın:

<div class="alertbar">All items 20% off!</div>

Bu eklemeden sonra dosyanın nasıl görünmesi gerektiği aşağıda açıklanmıştır:

WordPress'te PHP kodu ekleme örneği

Bu, "Tüm ürünlerde %20 indirim!" mesajını görüntüleyecektir. uyarı çubuğunuzdaki Metni istediğiniz gibi özelleştirebilirsiniz.

2. Adım: Özel CSS Ekleyin

Son olarak, alarmınızın stilini belirlemek için Basamaklı Stil Sayfalarını (CSS) kullanmanız gerekecek. WordPress Özelleştirici'yi kullanarak CSS ekleyebilirsiniz.

Bunu yapmak için, WordPress panonuza gidin ve Görünüm > Özelleştir'e gidin. Bu, sitenizi Özelleştirici'de açacaktır. Kenar çubuğunda, Ek CSS'yi seçin. Bu, özel CSS'yi girebileceğiniz bir kod kutusu açar.

Aşağıdaki kodu metin alanına yapıştırın:

.alertbar {

background-color: #A9A9A9;

color: #FFFFFF;

display: block;

line-height: 45px;

height: 50px;

position: relative;

text-align: center;

text-decoration: none;

top: 0px;

width: 100%;

z-index: 100;

}

Uyarı şu şekilde görünür:

Yukarıdaki kod, beyaz metin içeren koyu gri bir çubuk oluşturur - ancak renkleri ve boyutu temanıza uyacak şekilde istediğiniz gibi değiştirebilirsiniz. İşiniz bittiğinde, değişikliklerinizi kaydetmek için Yayınla'ya tıklayın.

WP Motoru ile Sitenizi Geliştirin

E-posta kayıtlarını artırmak veya ziyaretçileri özel teklifler hakkında bilgilendirmek için basit bir yola ihtiyacınız olsun, bir uyarı kutusu zarif ve etkili bir çözümdür. WordPress sitenize bir tane uygulamak, dönüşüm oranınızı önemli ölçüde artırabilir.

Popup Maker gibi bir WordPress eklentisiyle bir uyarı kutusu uygulayabilirsiniz. Ayrıca, biraz CSS ile nispeten kolay bir şekilde kendiniz de kodlayabilirsiniz. Her iki durumda da, kayıtları ve dönüşümleri artırmak için tasarlanmış özelleştirilebilir bir uyarı alırsınız.

Sitenizi daha da geliştirmek istiyorsanız, özel WordPress barındırma planlarımıza göz atmayı unutmayın!