Bir Işık Kutusu Açılır Penceresi Oluşturun

Sitenizde Nasıl Açılır Pencere Pop-up Oluşturulur (Adım Adım)

Siteniz için bir lightbox popup oluşturmanın bir yolunu mu arıyorsunuz?

Bir lightbox popup, potansiyel müşteri kazanmak için inanılmaz derecede etkili olabilir. İkna etmek ve dönüştürmek için tasarlanmışlardır.

Ancak sıfırdan bir tane kodlamak gerçek bir baş belasıdır. Birincisi, açılır pencereyi oluşturmak için yeterli HTML, CSS ve Javascript bilgisine sahip olmanız gerekir, ayrıca ne zaman göstereceğinize dair tetikleyici kuralları da bilmeniz gerekir. Ardından, e-posta hizmeti sağlayıcınızla manuel bir entegrasyon oluşturmanız gerekir. Ve son olarak, gizlilik ve güvenlik sorunlarıyla uğraşmanız gerekir.

İyi haber: çok daha basit bir yol var.

Bu makalede, 10 dakikadan kısa sürede ve hiç kodlama yapmadan bir lightbox popup'ı nasıl başlatacağınızı göstereceğiz.

Hadi başlayalım.

Lightbox Popup Nedir?

Bir lightbox popup, sinematik bir efektle açılan bir kayıt formudur. Bir lightbox açıldığında, arka plandaki sitenin geri kalanını bulanıklaştırır. Bu şekilde, tüm odağınız popup'ın üzerinde olur.

Işık kutusu açılır penceresi örneği

Kökeninde, lightbox konsepti dış mekan reklamcılığından gelmektedir:

Işık kutusu reklamı

Ve sonra, bazı geliştiriciler bunun gerçekten harika bir efekt olduğunu düşündüler ve web varlıklarında aynı efekti yeniden oluşturmak için bir Javascript kütüphanesi oluşturdular. Daha sonra, lightbox popup'larını kullanma fikri ortaya çıktı.

Lightbox Popup'ları Neden İşe Yarar

Lightbox popup'ları, geleneksel bir e-posta kayıt formundan daha fazla e-posta toplar.

Peki neden işe yarıyorlar?

Lightbox popup'larının neden bu kadar iyi çalıştığının ana nedenlerine hızlıca bir göz atalım.

#1. Lightbox Popup'ları Açık Bir Eylem Çağrısı Sunar

Çoğu insan, müşterilerine çok fazla seçenek vermenin harika bir şey olduğuna inanır.

Ancak bu pek doğru değil.

Doğrudan dönüşümler arıyorsanız, hedef kitlenizin odaklanabileceği tek, net bir eylem çağrısı istersiniz. Bu şekilde, kullanıcının zihninden tüm dikkat dağıtıcı unsurları kaldırırsınız. Ve lightbox popup'ları, temel teklifinizi vurgulamak ve insanların eylem çağrınıza odaklanmasını sağlamak için harika bir iş çıkarır.

Yani, doğal olarak, dönüşüm oranları oldukça harika.

#2. Lightbox Popup'ları Göz Ardı Edilemez

Lightbox popup'ları tüm ekranı kaplar ve diğer her şeyi bulanıklaştırır. Bu yüzden onları görmezden gelmek pratikte imkansızdır.

Bu, özellikle animasyonlu olduklarında geçerlidir:

açılır pencere animasyon efektleri

Elbette, popup'larınızın müdahaleci olmadığından emin olmalısınız. Ve bunu, sitenizde farklı popup'ları ne zaman tetikleyeceğinizi özelleştirerek yapabilirsiniz. Hedef kitleniz kesintiden rahatsız olmadığı sürece, onları çok kolay bir şekilde ikna edip dönüştürebilirsiniz.

#3. Lightbox Popup'ları Kişiselleştirilmiş Tetikleyicilere Sahiptir

Tüm web ziyaretçilerinize aynı teklifi göstermemelisiniz. Bir e-ticaret mağazası işletiyorsanız, yeni ve geri dönen müşteriler için çok farklı tekliflere ihtiyacınız olacaktır.

Yeni bir müşteri için bir hoş geldiniz kampanyası tetikleyebilirsiniz:

Kupon açılır penceresi

Ancak geri dönen bir müşteri için onlara farklı bir teklif göndermek isteyebilirsiniz:

Etkileşim Kupon Açılır Penceresi

Her iki teklifin de indirim miktarlarının tam olarak aynı olduğuna dikkat edin. Ancak teklifin sunulma şekli büyük ölçüde farklı. Ve bu çok önemli çünkü lightbox popup'ları tiyatro efektleri için tasarlanmıştır. Bu nedenle, daha kişiselleştirilmiş bir yaklaşım kesinlikle çok daha iyi sonuçlar almanızı sağlayacaktır.

Kullanıcının içerik tercihlerine göre teklifi kişiselleştirebilirsiniz bile. Akşam yemeği tarifleri hakkında bir makale okuyorlarsa, arabalar için bir teklif göstermek yerine akşam yemeği tarifleriyle ilgili bir teklif göstermek daha mantıklıdır.

Country Living Çıkış Açılır Penceresi

#4. Lightbox Popup'ları Ayrılan Ziyaretçileri Yakalayabilir

Light boxlar, açılır pencerenizi görüntülemenin yalnızca bir yöntemidir. Bu nedenle, tetikleyiciyi istediğiniz ölçüde özelleştirmenizi engelleyen hiçbir şey yoktur. Çıkış niyeti ışık kutusu açılır pencereleri oluşturmanızı öneririz.

Çıkış Niyeti Açılır Penceresi

Ziyaretçileriniz web sitenizden çıkmaya çalıştığında çıkış niyeti açılır pencereleri tetiklenir. Sonuç olarak, aksi takdirde sitenizi terk etmiş olacak çok sayıda ziyaretçiyi tutarsınız. Bu nedenle, site terk etme sorunundan muzdaripseniz, kesinlikle bir çıkış niyeti ışık kutusu açılır penceresi oluşturmalısınız.

Işık Kutusu Açılır Penceresi Nasıl Oluşturulur

Artık ışık kutusu açılır penceresinin ne olduğunu ve neden bir tane oluşturmak isteyeceğinizi anladığınıza göre, ışık kutusu açılır penceresini nasıl oluşturursunuz? Açılır pencerelerinizi oluşturmak için OptinMonster kullanmanızı öneririz.

OptinMonster ana sayfası

OptinMonster, dünyanın 1 numaralı dönüşüm araç setidir ve biz de kendimiz kullandık. OptinMonster, güçlü ve dönüşüm sağlayan pop-up'lar oluşturmayı çok basit hale getirir. Ve hiç kodlama kullanmanız gerekmez.

Hatta tam bir OptinMonster incelemesi yazdık.

Buna göz atabilir veya kampanyanıza hemen başlayabilirsiniz. Tek yapmanız gereken OptinMonster'a kaydolmak ve bu makalenin geri kalanını takip etmek.

Adım #1: Bir Kampanya Oluşturun

OptinMonster kontrol panelinize gidin ve Oluştur düğmesine basın:

Yeni bir açılır pencere kampanyası oluştur

Işık Kutusu Açılır Penceresi kampanya türünü seçin:

bir ışık kutusu açılır penceresi oluşturun

Ardından, bir kampanya şablonu seçin. İstediğiniz şablonu seçebilirsiniz, ancak bu eğitim için Basit kampanya türüyle devam edeceğiz.

Açılır pencere kampanyası temasını seçin

Şimdi kampanyanıza bir ad verin. Unutmayın, bu kampanya adı sizin içindir ve muhtemelen farklı hedefleme seçenekleriyle bir sürü bu tür açılır pencere oluşturacaksınız. Bu nedenle, kampanyaya anlamlı bir ad verin, yoksa daha sonra gerçekten kafanız karışır.

Ayrıca, planınıza bağlı olarak OptinMonster'ı birden fazla sitede de kullanabilirsiniz. Bu nedenle, kampanyanızın nerede gösterilmesini istediğinizi de seçin.

Kampanya kimliği oluştur

İşiniz bittiğinde Oluşturmaya Başla düğmesine basın.

Adım #2: Işık Kutusu Açılır Pencerenizi Düzenleyin

OptinMonster ile sürükle ve bırak görsel açılır pencere oluşturucuya sahip olursunuz. Kampanyanızın oluşturulmasını tamamladığınızda, açılır pencerenizin en küçük ayrıntılarını bile düzenleyebileceksiniz. Açılır pencere başlığınızı düzenleyerek başlayın:

Başlığınızı düzenleyin

Buradaki en inanılmaz şey, düzenlemek istediğiniz herhangi bir metne tıklayıp satır içi değiştirebilmenizdir. Açılır pencerede bir formu doldurmaya veya herhangi bir HTML kodu düzenlemeye gerek yoktur.

Ardından, net bir harekete geçirici mesaj oluşturmak için düğme metninizi ve görünümünü ayarlayın:

CTA'ları Özelleştirin

Açılır pencerenizin görünümünden memnun kaldığınızda, daha gelişmiş ayarlara geçebilirsiniz.

Adım #3: Görüntüleme Kurallarını Ayarlayın

Görüntüleme kuralları, kampanyanızın sitenizde ne zaman görüneceğini ve kimin göreceğini tanımlamak için kullanılır.

Açılır Pencere Görüntüleme Kuralları

Önerimiz, tetikleyici koşulu çıkış amacına değiştirmektir:

Çıkış Niyeti Açılır Penceresi

Eylem'i seçmek için Sonraki Adım'a tıklayın. Burada, Kampanya görünümünü göster seçeneğini Optin Görünümü olarak ayarlamanızı, MonsterEffect ile göster seçeneğini istediğiniz herhangi bir giriş animasyonuna ayarlamanızı ve açılır pencereniz için ses efekti çal seçeneğini istediğiniz herhangi bir ses efektine ayarlamanızı öneririz.

Kampanya Eylem Ayarları

Ardından, Sonraki Adım düğmesine tıklayın. Ayarlarınızın tam kapsamını Özet sekmesinde görebilirsiniz.

Adım #4: E-posta Entegrasyonunuzu Kurun

Bir sonraki adım e-posta entegrasyonunuzu kurmaktır. Entegrasyonlar sekmesinden Yeni Entegrasyon Ekle'ye tıklayın ve e-posta hizmeti sağlayıcınızı seçin:

OptinMonster Entegrasyonları

Eğer henüz bir e-posta hizmeti sağlayıcınız yoksa, e-posta pazarlamanız için Drip kullanmanızı öneririz.

Adım #5: Işık Kutusu Açılır Pencerenizi Yayınlayın

Yeni bir kampanya oluşturduğunuzda, varsayılan olarak Duraklatılmış durumdadır.

Yayın Seçenekleri'ni görmek için üst menüden Yayınla sekmesine gidin. Ardından durumu Yayınla olarak ayarlayın ve web sitesi platformunu seçin:

OptinMonster kampanyasını yayınla

Bir WordPress siteniz varsa, OptinMonster eklentisi geri kalan kurulumu otomatik olarak halleder. Shopify ve BigCommerce için de aynıdır. Diğer herhangi bir site için Herhangi Bir Site'ye tıklayın ve ekleme kodunu web sitenizin başlığına yapıştırın:

Genel Gömme

Ve işte bu kadar!

BONUS: Açılır Pencerenizden Anlık Bildirim Aboneleri Toplayın

Anlık bildirimler, web sitesi trafiğinizi ve etkileşiminizi otomatik olarak artırmanıza yardımcı olur. Web anlık bildirimleri, oturumunu terk etmiş veya web sitesinden ayrılmış kullanıcıları geri getirmenin etkili bir yoludur. Yeni içerik, teklifler veya etkinliklerden onları haberdar ederek kullanıcıları yeniden etkileşim kurmaya yardımcı olur.

Anlık bildirimler ayrıca, kullanıcıları bir makale okumak, bir satın alma işlemini tamamlamak veya bir etkinliğe katılmak gibi belirli eylemleri gerçekleştirmeye teşvik eden net ve eyleme geçirilebilir mesajlar ve harekete geçirici mesaj düğmeleri içerir.

Mesajların her kullanıcı için alakalı ve değerli olmasını sağlamak amacıyla anlık bildirimleri kullanıcıların tercihlerine, davranışlarına ve ilgi alanlarına göre uyarlayabilirsiniz. Kullanıcıların web anlık bildirimlerini almayı kabul etmesi gerekir. Bu, mesajların spam olarak görülmemesini ve kullanıcıların izniyle gönderilmesini sağlar.

En havalı yanı, e-posta açılır pencerenizden anlık bildirim aboneleri toplayabilmenizdir. Yani, sitenizi ziyaret edenler e-posta kimliklerini vermekten kaçınsalar bile, onları yine de web anlık bildirimlerini kullanarak abone olmaya ikna edebilirsiniz.

Ve üzerinde çalışacağımız şey bu.

Adım #1: Bir Anlık Bildirim Hizmeti Seçin

Web anlık bildirimleri göndermek için PushEngage kullanmanızı öneririz.

PushEngage anında iletme bildirimi hizmetleri

İşte PushEngage ile elde ettiklerinizin hızlı bir özeti:

  • Yüksek dönüşüm sağlayan otomatik kampanyalar
  • Birden çok hedefleme ve kampanya zamanlama seçenekleri
  • Hedef izleme ve gelişmiş analizler
  • Akıllı A/B testi
  • Özel Bir Başarı Yöneticisi

Ücretsiz başlayabilirsiniz, ancak işletmenizi büyütme konusunda ciddiyseniz, ücretli bir plan satın almalısınız. Ayrıca, herhangi bir anlık bildirim hizmeti satın almadan önce, anlık bildirim maliyetleri hakkındaki bu kılavuza göz atmalısınız.

Ve bir çevrimiçi mağaza işletiyorsanız, PushEngage ayrıca otomatik e-ticaret push bildirimleri oluşturmanıza yardımcı olarak satışlarınızı artırmanıza yardımcı olur.

İşletmeniz için trafik, etkileşim ve satış oluşturmak istiyorsanız, PushEngage'in tartışmasız en iyi seçenek olduğunu göreceksiniz. Ve bütçeniz kısıtlıysa, anlık bildirimlerinizle biraz yaratıcı olabilirsiniz.

Adım #2: Açılır Pencerenize Bir HTML Bloğu Ekleyin

Öncelikle, OptinMonster'daki kenar çubuğundan açılır pencerenize bir HTML bloğu ekleyin.

OptinMonster'da HTML bloğu ekleyin

Burada anlık bildirim abonelerini toplamak için kodu ekleyeceğiz. Öncelikle, tıklanabilir bir düğme oluşturmak için aşağıdaki kodu yapıştırın:

<button onclick="subscribeOnClickButton()" style="border: none; width: 100%; padding-left: 15%; padding-right:15%; text-align: center; display: inline-block; color: white;">Get Updates via Push Notifications Instead</button>

Kodu, HTML ekleyebileceğinizi söylediği yere yapıştırın:

Açılır Pencereye HTML Kodu Ekle

Bu noktada, açılır pencerenizde e-posta abonelik düğmesinin hemen altında, "Anlık Bildirimler Yoluyla Güncellemeleri Alın" yazan yeni bir düğme görmelisiniz:

Açılır Pencereye Anlık Bildirim Abonelik Düğmesi Ekle

Elbette, daha çekici görünmesini sağlamak için stillerle oynayabilirsiniz. Ardından, düğmeye tıklandığında anlık bildirim abonelerini toplayacağız.

Adım #3: PushEngage'dan Abonelik Kodunu Alın

PushEngage ana sayfasına gidin ve Başlayın düğmesine tıklayın:

PushEngage

Ardından, PushEngage'i denemek için ücretsiz planı seçmek isteyeceksiniz veya işletmenizi büyütme konusunda ciddiyseniz ücretli bir planı seçin. Ücretli planlar daha fazla kampanya seçeneği ve daha büyük abone listeleri oluşturma olanağı sunar.

PushEngage kontrol panelinizde, Site Ayarları » Site Detayları bölümüne gidin ve Kurulum Talimatları İçin Buraya Tıklayın düğmesine tıklayın. Herhangi Bir Site altında, kurulum kodunuzu alacaksınız:

PushEngage Herhangi Bir Site Kurulum Kodu

UYARI: Kontrol panelinizden aldığınız kodu kopyalamanız gerekir. Kod, her PushEngage kullanıcısı için benzersizdir. Görüntüdeki kodu kopyalayarak anlık bildirim aboneleri toplayamazsınız.

Kodunuzu PushEngage kontrol panelinizde aldıktan sonra, ikinci betiği alın ve ona ek kod ekleyin. Nihai kodunuz şuna benzer olmalıdır:

<script src="https://clientcdn.pushengage.com/core/02a6e92667ae2279fcba8932356c1d93.js" async></script>
<script> window._peq = window._peq || [];
function subscribeOnClickButton(){
window._peq.push(['subscribe',{}.pe,function(res){
console.log(res);
}]);
}
</script>

Adım #4: Abonelik Kodunuzu Açılır Pencerenizdeki HTML Bloğuna Ekleyin

Bu kodu OptinMonster'daki HTML bloğuna ekleyin ve hazırsınız!

Düğmeye Abonelik Kodunu Ekle

İşiniz bittiğinde, Kaydet ve Yayımla düğmelerine dokunmanız yeterlidir.

Web sitenizi kontrol ederseniz, şimdi ışık kutusu açılır penceresinin hem e-posta hem de anlık bildirim abonelerini topladığını görmelisiniz:

Açılır Pencereden Anlık Bildirim Aboneleri Toplayın

Ve işte bu kadar, açılır pencerenizden anlık bildirim aboneleri topluyorsunuz. Anlık bildirimler kendi açılır pencere modalleriyle birlikte gelir. Ancak özelleştirmeleri biraz zordur. Bu nedenle, OptinMonster kullanarak güzel açılır pencereler oluşturabilir ve ardından bunları anlık bildirim açılır pencereleriniz olarak kullanabilirsiniz.

Bir Işık Kutusu Açılır Penceresi Oluşturduktan Sonra Ne Yapmalı

Bu kadar, millet!

Bu makalenin yardımcı olup olmadığını bize bildirin. Sitenizde açılır pencereler oluşturmak, trafiğinizi e-posta abonelerine ve gerçek işletme potansiyellerine dönüştürmenize yardımcı olabilir. Ve hemen ışık kutusu açılır pencereleri oluşturmaya başlamanızı şiddetle tavsiye ederiz.

Ve trafiğinizi artırmak için uygun fiyatlı bir yol arıyorsanız, anlık bildirimleri kullanmanızı öneririz. Anlık bildirimler, daha fazla tekrar eden trafik ve site etkileşimi getirmenize yardımcı olabilir. Ayrıca satış üreten otomatik anlık bildirim kampanyaları da oluşturabilirsiniz.

İkna olmadınız mı? Bu kaynaklara göz atın:

Anlık bildirim kampanyalarınızı oluşturmak için PushEngage kullanmanızı öneririz. PushEngage, dünyanın 1 numaralı anlık bildirim yazılımıdır. Bu nedenle, henüz yapmadıysanız, bugün PushEngage ile başlayın!

Yorum Ekle

Yorum bırakmayı seçtiğiniz için mutluyuz. Lütfen tüm yorumların gizlilik politikamıza göre denetlendiğini ve tüm bağlantıların nofollow olduğunu unutmayın. Ad alanında anahtar kelimeler KULLANMAYIN. Kişisel ve anlamlı bir sohbet edelim.

Web Sitenizden Ayrıldıktan Sonra Ziyaretçileri Etkileşimde Tutun ve Elde Tutun

Gözden kaçması zor Anlık Bildirimlerle her web ziyaretinin değerini artırın.

  • Sonsuza Kadar Ücretsiz Plan
  • Kolay Kurulum
  • 5 Yıldız Destek