Web site ziyaretçilerinin form doldurma ve dönüşüm oranlarını arttırmak için kullanılan, açılır pencerelerle (pop-up) hemen hemen herkes karşılaşmıştır. Kendi web sitenizde pop-up formatında  form yayınlayarak ziyaretçi dönüşüm oranlarınızı arttırmak için yapmanız gereken tüm yönergeleri bu yazımızda sizin için derledik.

Neden Pop-up form kullanmalıyım?

Web sitenizde gezen bir ziyaretçiye iyi bir kullanıcı deneyimi sunmak istiyorsak sayfa içindeki gezintiyi bölmememiz gereklidir. Örnek vermek gerekirse; Ziyaretçi web sitenizde bir makale okurken konuyla alakalı bir CTA (Call to action) butonuna bastığında ziyaretçiyi farklı bir sayfaya yönlendirmek, ziyaretçilerinizi yoracak, sunucu kaynaklarınızı gereksiz yere tüketecektir. Buna ek olarak sayfanın içerisinde farklı alanlara kaydırma yaparak iletişim formuna ziyaretçiyi göndermekte, ziyaretçide aynı olumsuz etkiyi bırakmaktadır. Bunun yerine CTA butonlarınıza pop-up form ekleyerek hem dönüşüm oranınızı arttırabilir hem de ziyaretçinizin içeriğinize kaldığı yerden göz atmasını sağlayabilirsiniz.

WordPress’te Pop-up form kullanmak için neler gereklidir?

WordPress web sitenize pop-up form ekleyebilmek için ücretsiz faydalanabileceğiniz iki eklenti bulunmaktadır. İhtiyacınız olan eklentiler; Contact Form 7 ve Popupmaker’dır. Eklentilerimizi
Plugins -> Add new Sekmelerini Takip ederek Kuralım ve “Activate” butonuna basarak etkinleştirelim.
Yanlış eklenti eklememek için kurduğunuz eklentilerin logolarının aşağıdakilerle eşleştiğinden emin olun.

1.     Adım Contact Form 7 ile iletişim formu oluşturma

Admin panelinin sol tarafında bulunan listeden Contact -> Add New diyerek yeni bir iletişim formu oluşturalım. Contact Form 7 kişiselleştirilebilir olması açısından  birçok web sitesinde  aktif olarak kullanılan iletişim formu eklentisidir.

Formumuzun Özelliklerini düzenledikten sonra save diyerek iletişim formumuzu tamamlıyoruz. Ekrana gelen kısa kodu Pop-up Maker eklentisine eklemek için kopyalıyoruz.

2.     Adım Pop-up Maker’a Formumuzu entegre etme

Oluşturduğumuz formdan aldığımız kısa kodu yeni oluşturacağımız pop-up ekranına yapıştıracağız. Sağ panelimizden sırasıyla Popup-maker -> Create Popup sekmelerini tıklıyoruz.

Açılan pencerede doldurulması gereken alanları doldurduktan sonra, oluşturduğumuz formun kısa kodunu altta açılan metin editörüne yerleştiriyoruz.

Şuan Pop-up Formumuz hazır fakat ne zaman açılacağını belirlemedik. Formumuzun açılır pencere ile gelmesi için bir tetikleyici belirlememiz gerekmektedir. Sayfayı biraz daha aşağı kaydırdığımızda Pop-up Settings Alanı ile karşılaşıyoruz.  Triggers sekmesinden  Add new trigger diyerek formumuzun ne zaman çalışacağını belirliyoruz. Bir butona tıkladığımızda çalışmasını istiyorsak Click Open seçeneğini seçerek, ardından Add butonuna tıklayarak bir sonraki adıma geçiyoruz.

Hangi nesneye tıklandığında formumuzun ekranda gösterilmesini istiyorsak Css id veya class adresini belirleyerek o nesneye tıklandığında formumuzun tetiklenmesini sağlıyoruz.

İd özelliğini verdiğimiz butona tıkladığımız zaman, iletişim formumuzun pop-up şeklinde ekrana gelmesi gerekmektedir. Eğer bir hata ile karşılaşıyorsanız başa dönüp gerçekleştirdiğiniz adımları tekrardan kontrol edebilirsiniz.