Sitenizde Bir Lightbox Pop-up'ı Nasıl Oluşturulur (Adım Adım)

Yayınlanan: 2021-12-31

Siteniz için bir ışık kutusu açılır penceresi oluşturmanın bir yolunu mu arıyorsunuz?

Bir ışık kutusu açılır penceresi, potansiyel müşterileri yakalamak için inanılmaz derecede etkili olabilir. İkna etmek ve dönüştürmek için tasarlandılar.

Ancak bir tanesini sıfırdan kodlamak gerçek bir acıdır. Birincisi, ne zaman gösterileceğine ilişkin tetikleyici kurallarla birlikte açılır pencereyi oluşturmak için yeterli HTML, CSS ve Javascript bilmeniz gerekir. Ardından, e-posta servis sağlayıcınızla manuel bir entegrasyon oluşturmanız gerekir. Son olarak, herhangi bir gizlilik ve güvenlik sorunuyla ilgilenmeniz gerekir.

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

Bu makalede, sıfır kodlama ile 10 dakikadan daha kısa sürede bir lightbox açılır penceresini nasıl başlatacağınızı göstereceğiz.

Hadi dalalım.

Işık Kutusu Açılır Penceresi nedir?

Bir ışık kutusu açılır penceresi, sinematik bir efektle açılan bir katılım formudur. Bir ışık kutusu açıldığında, sitenin geri kalanını arka planda bulanıklaştırır. Bu şekilde, tüm odağınız açılır pencerede olur.

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

Başlangıçta, ışık kutuları kavramı açık hava reklamcılığından gelir:

Işık kutusu reklamı

Sonra bazı geliştiriciler bunun gerçekten harika bir etki olduğunu düşündüler ve aynı etkiyi web varlıklarında yeniden yaratmak için bir Javascript kitaplığı oluşturdular. Daha sonra, lightbox açılır pencerelerini kullanma fikri devreye girdi.

Lightbox Pop-up'ları Neden Çalışır?

Lightbox açılır pencereleri, geleneksel bir e-posta tercih formundan daha fazla e-posta yakalar.

Ama neden çalışıyorlar?

Işık kutusu açılır pencerelerinin bu kadar iyi çalışmasının ana nedenlerine hızlıca bir göz atalım.

#1. Lightbox Pop-up'ları Net Bir Harekete Geçirici Mesaja Sahiptir

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

Ama bu gerçekten doğru değil.

Doğrudan dönüşümler arıyorsanız, kitlenizin odaklanabileceği tek ve net bir harekete geçirici mesaj istersiniz. Bu şekilde, kullanıcının zihnindeki tüm dikkat dağıtıcı unsurları ortadan kaldırırsınız. Işık kutusu açılır pencereleri, temel teklifinizi vurgulama ve insanların harekete geçirici mesajınıza odaklanmasını sağlama konusunda harika bir iş çıkarır.

Bu nedenle, doğal olarak, dönüşüm oranları oldukça iyidir.

#2. Lightbox Pop-up'larını Yoksaymak İmkansız

Lightbox açılır pencereleri tüm ekranı kaplar ve diğer her şeyi bulanıklaştırır. Bu nedenle, onları görmezden gelmek neredeyse imkansızdır.

Bu, özellikle animasyonluysa geçerlidir:

açılır animasyon efektleri

Elbette, açılır pencerelerinizin müdahaleci olmadığından emin olmalısınız. Bunu, sitenizde farklı açılır pencerelerin ne zaman tetikleneceğini özelleştirerek yapabilirsiniz. Kitleniz kesintiden rahatsız olmadığı sürece, onları çok kolayca ikna edebilir ve dönüştürebilirsiniz.

#3. Lightbox Pop-up'ları Kişiselleştirilmiş Tetikleyicilere Sahiptir

Aynı teklifi tüm web ziyaretçilerinize 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 olacak.

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

Kupon açılır penceresi

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

Nişan Kuponu Açılır Penceresi

Her iki teklif için de indirim tutarlarının tamamen aynı olduğuna dikkat edin. Ancak teklifin çerçevelenme şekli büyük ölçüde farklıdır. Ve bu çok önemlidir çünkü ışık kutusu açılır pencereleri teatral efektler için oluşturulmuştur. Bu nedenle, daha kişiselleştirilmiş bir yaklaşım kesinlikle size çok daha iyi sonuçlar verecektir.

Hatta, kullanıcınızın içerik tercihlerine göre teklifi kişiselleştirebilirsiniz. Akşam yemeği tarifleriyle ilgili bir makale okuyorlarsa, onlara arabalar için bir teklif göstermek yerine yemek tarifleriyle ilgili bir teklif göstermek daha mantıklı.

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

#4. Lightbox Pop-up'ları Terk Eden Ziyaretçileri Yakalayabilir

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

Niyet Açılır Penceresinden Çık

Çıkış amaçlı açılır pencereler, ziyaretçileriniz web sitenizden çıkmaya çalıştığında tetiklenir. Sonuç olarak, aksi takdirde sitenizi terk edecek çok sayıda ziyaretçiyi elinizde tutarsınız. Bu nedenle, sitenin terk edilmesinden muzdaripseniz, kesinlikle çıkış amaçlı bir ışık kutusu açılır penceresi oluşturmalısınız.

Bir Lightbox Pop-up'ı Nasıl Oluşturulur

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

OptinMonster ana sayfası

OptinMonster dünyanın 1 numaralı dönüştürme araç takımıdır ve biz bunu kendimiz kullandık. OptinMonster, dönüştüren güçlü açılır pencereler oluşturmayı son derece basit hale getirir. Ve hiçbir zaman herhangi bir kodlama kullanmak zorunda kalmayacaksınız.

OptinMonster'ın tam bir incelemesini bile yazdık.

Bunu kontrol edebilir veya hemen kampanyanıza başlayabilirsiniz. Tek yapmanız gereken OptinMonster'a kaydolmak ve bu makalenin geri kalanını takip etmek.

1. Adım: Bir Kampanya Oluşturun

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

Yeni bir pop-up kampanyası oluşturun

Lightbox Popup kampanya türünü seçin:

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

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

Pop-up kampanya temasını seçin

Şimdi kampanyanıza bir isim verin. Unutmayın, bu kampanya adı sizin için ve büyük olasılıkla farklı hedefleme seçenekleriyle bu pop-up'lardan bir sürü oluşturacaksınız. Bu nedenle, kampanyaya anlamlı bir ad verin, yoksa daha sonra kafanız gerçekten karışır.

Ayrıca planınıza bağlı olarak OptinMonster'ı birden fazla sitede de kullanabilirsiniz. Bu nedenle, kampanyanızı da görüntülemek istediğiniz web sitesini seçin.

Kampanya kimliği oluştur

İşiniz bittiğinde İnşayı Başlat'a basın.

Adım #2: Açılır Pencerenizi Düzenleyin

OptinMonster ile görsel bir sürükle ve bırak açılır pencere oluşturucusu elde edeceksiniz. Kampanyanızı oluşturmayı tamamladığınızda, açılır pencerenizle ilgili en küçük ayrıntıları bile düzenleyebileceksiniz. Açılır başlığınızı düzenleyerek başlayın:

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

Buradaki en şaşırtıcı kısım, düzenlemek istediğiniz metni tıklamanız ve satır içinde değiştirmenizdir. Açılır pencerede bir form doldurmanıza veya herhangi bir HTML kodunu düzenlemenize gerek yoktur.

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

CTA'ları özelleştirin

Açılır pencerenizin görünümünden memnun olduğunuzda, 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 onu kimin göreceğini tanımlamaya yöneliktir.

Pop-up görüntüleme kuralları

Önerimiz, tetikleme koşulunu çıkış amacı olarak değiştirmenizdir:

Çıkış amacı ışık kutusu açılır penceresi

Eylemi 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österiyi istediğiniz herhangi bir giriş animasyonuna ayarlamanızı ve açılır pencereniz için herhangi bir ses efektine ses efekti oynatmanızı öneririz.

Kampanya Eylem Ayarları

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

4. Adım: E-posta Entegrasyonunuzu Kurun

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

OptinMonster Entegrasyonları

Halihazırda bir e-posta servis sağlayıcınız yoksa, e-posta pazarlamanız için Drip'i 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ılır .

Yayınlama Seçeneklerini 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ınlayın

Bir WordPress sitesi çalıştırıyorsanız, OptinMonster eklentisi kurulumun geri kalanını otomatik olarak halleder. Shopify ve BigCommerce için aynıdır. Başka herhangi bir site için, Herhangi Bir Site'ye tıklayın ve yerleştirme kodunu web sitenizin kafasına yapıştırın:

Küresel Gömme

Ve işin bitti!

Toplama

Hepsi bu, 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ş fırsatlarına dönüştürmenize yardımcı olabilir. Ve hemen ışık kutusu açılır pencereleri oluşturmaya başlamanızı şiddetle tavsiye ederiz.

Trafiğinizi artırmanın uygun maliyetli bir yolunu arıyorsanız, anında iletme bildirimlerini kullanmanızı öneririz. Anında iletme bildirimleri, daha fazla tekrar trafik ve site etkileşimi sağlamanıza yardımcı olabilir. Ayrıca, satış oluşturan otomatik push bildirim kampanyaları da oluşturabilirsiniz.

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

  • Müşteri Bağlılığını Artırmak için 7 Akıllı Strateji
  • Anında Bildirimler Etkili mi? 7 İstatistik + 3 Uzman İpucu
  • Terk Edilmiş Sepet Push Bildirimleri Nasıl Kurulur (Kolay Eğitim)

Push bildirim kampanyalarınızı oluşturmak için PushEngage kullanmanızı öneririz. PushEngage, dünyanın 1 numaralı anında iletme bildirim yazılımıdır. Öyleyse, henüz yapmadıysanız, bugün PushEngage'i kullanmaya başlayın!