Elementor ile WordPress'e LightBox nasıl eklenir

Bir LightBox özelliğini WordPress web sitenize entegre ederek, ziyaretçilerin görsel içeriğinizle nasıl etkileşime girme şeklini dönüştürebilirsiniz. Bu zarif çözüm, yüksek kaliteli görüntüleri sergilemek, büyüleyici galeriler oluşturmak ve kullanıcı deneyimini bozmadan ayrıntılı ürün bilgileri sunmak için mükemmeldir. Aslında, kullanıcı deneyimini yeni zirvelere yükseltebilir.

İster portföyünüzü görüntülemek isteyen bir fotoğrafçı olun, ister ürün detayları sergilemek isteyen bir e -ticaret sitesi sahibi olun, LightBox özelliği harika bir seçenek olabilir. Siteniz Elementor ile oluşturulursa, ışık kutuları eklemek sadece bir adım uzaklıktadır.

Bu makalede, Elementor ile WordPress'e Lightbox'ın nasıl ekleneceğine dair kapsamlı, adım adım bir kılavuz sunacağız. Bu güçlü araçtan en iyi şekilde yararlanmak için sonuna kadar okuduğunuzdan emin olun!

WordPress'te ışık kutusu nedir?

Bir ışık kutusu bir açılır kaplamadır. Bir web sitesindeki görüntüleri, videoları ve diğer medya görsellerini daha büyük ve daha odaklanmış bir görünümde görüntüler. Kullanıcılar ilgili bir düğmeyi, bağlantı veya küçük resimleri tıkladığında, LightBox özelliği arka planı karartırken ekli görselleri daha büyük bir görünümde sergiler.

İçeriği vurgulamaya yardımcı olur. Bu özellik, daha yakından bakılabilen galeriler, portföyler ve ürün ekranları için idealdir. LightBox özelliğini dahil ederek, yalnızca görsel içeriğinizi ilgi çekici hale getiremez, aynı zamanda kitlelerinizi uzun süre web sitesinde kalmasını sağlarsınız.

Bir web sitesine LightBox eklemenin avantajları

Öğreticiye atlamadan önce, LightBox özelliğini aşağıda tartışılan noktalardan bir web sitesine eklemenin temel avantajlarından bazılarına hızlıca bakın.

• Geliştirilmiş Kullanıcı Deneyimi

Bir LightBox, web sitesi tarama oturumlarını kesintiye uğratmadan kullanıcılara içerik gösterir. Ziyaretçiler, diğer web sitesi öğelerinin üstünde göründüğü için öne çıkan içeriğe odaklanabilir. Kullanıcı deneyimini geliştirmenin sırlarını keşfedin.

• Geliştirilmiş görsel çekicilik

Işık kutuları, web sitelerinin kullanıcılar için daha çekici görünmesini sağlayan pürüzsüz animasyonlar ve çağdaş düzenler kullanır. Bu bir web sitesini daha profesyonel hale getirir.

• Görüntüler ve videolar için daha kolay gezinme

Işık kutuları, kullanıcıların multimedya öğelerini tek bir sayfada pürüzsüz navigasyon ve aralarında kolay geçişlerle görüntülemelerine izin verir. Medya dosyalarınızdan muzdaripseniz, medya kitaplığınızı ve dosyalarınızı yönetmek için HappyMedia'yı kullanın.

• Katılım ve etkileşimi artırır

Lightboxes, kullanıcıların görsel içeriği daha iyi görmelerine yardımcı olur, bu da web sitenizi daha fazla keşfetmek isteyebilir. Artan oturumları arama motoruna pozitif bir sinyal geçirebilir.

• Daha iyi içerik sunumuna izin verir

Işık kutuları, web sayfalarınızın yoğun görünmesini sağlamadan içeriği daha iyi görüntülemenize yardımcı olur. Bu, ürün resimlerinin yanı sıra grafikler ve etkinlik koleksiyonları gibi içerikler sunmak için harika.

Elementor ile WordPress'e LightBox nasıl eklenir

Şimdi öğretici bölümündeyiz. Bu bölümde, Elementor ile WordPress'e nasıl bir ışık kutusu ekleyeceğinizi göstereceğiz. Öğreticiye başlamak için, aşağıdaki eklentilerin sitenizde yüklendiğinden ve etkinleştirilmesini sağlamanız gerekir.

• Element
• Happyaddons

HappyAddons, Elementor eklentisinin önde gelen bir eklentisidir. Web sitenizi daha da güzelleştirmeye yardımcı olabilecek 130+ ek widget ve düzinelerce özellik ile birlikte gelir. Sitenize hazır olduktan sonra, aşağıda açıklanan öğreticileri izlemeye başlayın.

Adım 01: LightBox Widget'ı tuvale sürükleyin ve bırakın

Elementor Canvas ile bir gönderi veya sayfa açın. Elementor panelindeki Lightbox Widget'ı bulun. Tuvale sürükleyip bırakın.

Varsayılan olarak, LightBox Widget tuvale bir düğmeye eklenir.

Adım 02: Bir Işık Kutusu Türü Seçin

Widget iki ışık kutusu türü ile birlikte gelir - düğme ve görüntü . Widget için istediğiniz ışık kutusu türünü seçin. Bu öğretici için düğme türüyle gidiyoruz.

Adım 03: Görüntülemek istediğiniz içerik türünü seçin

LightBox Widget, bir resim veya video içeriği görüntülemenize olanak tanır. Aşağıda işaretlenen seçenekten görüntülemek istediğiniz içerik türünü seçin.

Video seçeneği seçilirse, YouTube, Vimeo ve kendi kendine barındırılan üç kaynaktan video içeriği ekleyebilirsiniz.

YouTube veya Vimeo kaynağı seçilirse, aşağıda eklenmiş ekran görüntüsünde gösterilen ilgili kutuya istediğiniz video bağlantısını ekleyebilirsiniz.

LightBox için görüntü türünü bile etkinleştirebilir ve bunun için bir resim yükleyebilirsiniz.

Adım 04: Lightbox düğmesine bir kopya ekleyin

Düğmeyi gerçekten anlamlı hale getiren uygun bir kopya yazın ve kullanıcıları tıklamalarını ilgilendirin.

Adım 05: Lightbox Widget için ayarları yapılandırın

Yukarıdakilere ek olarak, widget'ı optimize etmek için diğer seçenekleri kullanın. Örneğin, merkezi olarak veya güzel görünen her yerde hizalayın.

Adım 06: Lightbox Widget'ı stilize et

Şimdi Stil sekmesine gel. Bu sekmeden, widget için dolgu, sınır tipi, sınır yarıçapı, kutu gölgesi, tipografi, renk ve arka plan rengini özelleştirebilirsiniz. Bunu gerektiği gibi kendiniz yapın.

Adım 07: Lightbox'ı önizleme

Sadece düğmeye tıklayın. Işık kutusu aşağıda ekli video klip gibi görünüyorsa, sorun değil. Lightbox'ımızın kesinlikle iyi çalıştığını görebilirsiniz.

Adım 08: LightBox Widget'ı mobiline duyarlı hale getirin

Elementor panelinin altbilgisindeki duyarlı mod simgesini tıklayın. Bu, farklı ekran boyutları arasında geçiş yapma seçenekleriyle tuval üzerinde bir üst çubuk gösterecektir.

Tuvali farklı ekran boyutları arasında değiştirerek widget'ın tüm cihazlarda iyi görünüp görünmediğini kontrol edin. Belirli bir ekran boyutunda iyi görünmüyorsa, yalnızca bu ekran boyutu için özelleştirebilirsiniz.

Böylece, Elementor eklentisini kullanarak WordPress'te bir ışık kutusu oluşturabilirsiniz.

WordPress'te bir ışık kutusu oluşturmada dikkate alınması gereken şeyler

Umarım bu öğreticiden keyif almışsınızdır. Şimdi, bu bölümde, en iyi sonuçları elde etmek için WordPress'te bir ışık kutusu oluştururken göz önünde bulundurmanız gereken noktaları ele alacağız.

• Işık kutusunun amacı

Işık kutusunda ihtiyaç duyduğunuz ışık kutusu işlevini görüntüleri, videoları, formları veya galerileri göstermeye karar verin. Web sitenize ulaşmanıza yardımcı olan ve ziyaretçilerin ihtiyaçlarını karşılayan içerik planlayın.

• Görüntüleri sıkıştır

Ağır görüntüler eklemek web hızınızı yavaşlatabilir. Bu nedenle, ışık kutusuna eklemeden önce tüm resimlerinizi sıkıştırdığınızdan emin olun. Medya dosyalarını sıkıştırmak için HappyMeida'yı kullanın.

• Alter Metin S ekle

Görüntülere alternatif metinler eklemek, ışık kutusu görüntülerinizin SEO puanını artırabilir. Ayrıca, LightBox düğmesine veya bağlantısına ilgi çekici bir kopya ekleyin.

• Çıkış İşlevselliği

Çıkış işlevselliği kullanıcı deneyimi için çok önemlidir. Kullanıcılara, görünür bir düğmeyi göstererek ve kapatmalarını sağlayarak LightBox'tan çıkmanın kolay yollarını verin.

• Test ve sorun giderme

LightBox'ın tüm platformlarda çalıştığını onaylamak için çeşitli internet tarayıcılarında, cihazlarda ve görüntüleme boyutlarında nasıl performans gösterdiğini kontrol edin. Test ve deney yapmadan yayınlamayın.

Çözüm

Bir LightBox, ana sayfanın üst kısmındaki bir yer paylaşımında ortam görüntüleyerek kullanıcı katılımını geliştirir. Bu, ziyaretçilerin gezinmeden içeriğe odaklanmalarını sağlar. WordPress.org'da ışık kutuları oluşturmak için çok sayıda eklenti olsa da, Elementor en basit ve en kullanıcı dostu seçeneklerden biri olarak öne çıkıyor. Sayfa oluşturucuların hayranıysanız, Elementor kesinlikle dikkate almaya değer.

Lightbox Widget'ın ötesinde, HappyAddons eklentisi tarafından sunulan çok çeşitli özellikleri ve widget'ları da keşfedebilirsiniz. Bu güçlü araç, web sitenize daha fazla işlevsellik eklemenizi ve daha dinamik ve etkileşimli hale getirmenizi sağlar.

Bu öğreticiyi yararlı bulduysanız, sizden haber almak isteriz! Düşüncelerinizi veya sorularınızı aşağıdaki yorum kutusunda paylaşmaktan çekinmeyin.