WordPress Sitesine Lightbox Ekleme: Yeni Başlayanlar İçin Nihai Kılavuz

Lightbox, resim tabanlı bir web sitesi için birçok ilginç ve popüler özellikten biridir. Ancak herkes, özellikle yeni başlayanlar olmak üzere, bir WordPress web sitesine nasıl ışık kutusu ekleneceğini bilmiyor. Bu nedenle, yeni başlayanlar için WordPress web sitelerine ışık kutusu eklemelerine yardımcı olmak için bu kılavuzu sunuyoruz.

Lightbox Nedir ve Nasıl Eklenir?

Lightbox, tam ekran bir açılır pencere oluşturarak ve sayfanın geri kalanını karartarak görüntünüzü ve videonuzu görüntüleyen kalıcı bir görüntü galerisidir. Örneğin:

Bu güzel ve süslü efekt, bir portföy, fotoğrafçılık veya herhangi bir görüntü tabanlı web sitesi için son derece yararlıdır. Resmi net bir şekilde görmenizi sağlar ve web sitenizi daha seçkin hale getirir .

Normalde, bir WordPress web sitesi için ışık kutusuna sahip olmanın 3 yolu vardır:

• Kısa kod ekleme
• Eklenti yükleme
• Lightbox'ı destekleyen bir tema kullanma.

Yeni başlayanlar için, bir eklenti kullanmanızı veya bu özelliği göz önünde bulundurarak hazır bir tema bulmanızı öneririz çünkü kısa kod eklemek yalnızca ileri düzey kullanıcılar içindir.

Temanız Destekliyorsa Lightbox'ı Görüntüleyin

Temanız zaten galeri/resimler için ışık kutusunu görüntülüyorsa söylenecek bir şey yok. Ancak birçok temanın bunu göstermek için daha fazla adıma ihtiyacı olduğunu biliyoruz. Örneğin, bu tema ePortfolio ışık kutusunu destekler, ancak ışık kutusunu göstermek için galeriyi medya dosyasına bağlamanız gerekir.

Normalde iki seçenek vardır: medya dosyasına veya ek sayfasına bağlantı . Bir ek sayfasına resim/galeri bağladığınızda, resme tıkladığınızda sadece resmi içeren yeni, ayrı bir sayfa açılacaktır. Bir medya dosyasına bağlanırsanız, aşağıdaki gibi sayfayı değil, yalnızca görüntüyü gösterir:

İşte bunu yapmak için rehber.

Önce Gönderi Düzenleyici'ye gidin, ardından galeriye tıklayın.

Gutenberg Editörünü kullanıyorsanız, sağ kenar çubuğuna bakın, Bağlantı bölümünü göreceksiniz.

Tek bir resme gelince, araç çubuğundaki bu simgeye tıklamanız gerekir:

Klasik Düzenleyici'deyken, bir galeri ve tek bir görüntü oluşturduğunuzda veya düzenlediğinizde Bağlantı bölümü görünür.

Ardından, Medya Dosyası'nı seçin ve bitirmek için Galeri Ekle'yi tıklayın. Gönderiyi Güncellediğinizde veya Yayınladığınızda , o galeriye/resme tıklayın, ışık kutusunun çalıştığını göreceksiniz.

Temanız ışık kutusunu destekliyorsa, bu eylem istediğiniz galeri/görüntü için ışık kutusunu etkinleştirebilir. Aksi takdirde, hiç ışık kutusu olmayacaktır.

Ancak, yapılandırma farklı temalarla farklı olabilir. Örneğin, bazıları Özelleştirici'de çalışmanızı gerektirebilir, bazıları ise medya dosyası yerine ek sayfasına bir bağlantı eklemenizi gerektirebilir. Bu nedenle, temayı dikkatlice kontrol etmelisiniz .

Hangi temayı kullanırsanız kullanın, yine de bir galeri/resmi medya dosyasına nasıl bağlayacağınızı bilmeniz gerekir çünkü aşağıdaki eklentiyi kullanarak lightbox eklemek faydalı olacaktır.

Bir Eklenti Kullanarak Lightbox Ekleme

Gerçekten de, lightbox eklemek hiç de zor değil. "Işık kutusu eklentisi" anahtar kelimesini aratarak, bu efekt için bir dizi eklenti göreceksiniz. Araştırmamıza göre eklentileri iki türe ayırdık: karmaşık eklentiler ve lightbox eklemek için basit eklentiler.

Karmaşık eklentilere gelince, görüntü boyutu, kenarlık rengi, ışık kutusu stilleri gibi ışık kutusunu yüksek düzeyde özelleştirmek için çok daha karmaşık seçenekler vardır. Örneğin, Duyarlı Işık Kutusu ve Galerisi ve FooBox Görüntü Işık Kutusu daha fazla özelleştirme aracına sahiptir. Ancak yeni başlayan biriyseniz kullanımı daha zordur. Ayrıca, sonuç basit bir eklentiden çok da farklı değil. Bu yüzden Simple Lightbox gibi basit bir eklenti kullanmayı tercih ediyoruz.

Bu eklentinin kullanımı kolaydır, 200.000'den fazla aktif kurulumla oldukça popülerdir ve 160 beş yıldızla derecelendirilmiştir. Ayrıca, ışık kutusu tasarımı iyidir.

1. Adım: Basit Işık Kutusu Eklentisini Kurun ve Etkinleştirin

Pano > Eklenti > Yeni Ekle 'de , "simple lightbox" yazmanız ve Eklentiyi yükle'yi ve ardından Etkinleştir'i tıklamanız yeterlidir.

2. Adım: Simple Lightbox eklentisini kurun

Eklenti> Yüklü eklentileri olarak, Basit Işık sekmesinde ayarlama tıklayın.

Basit Işık Kutusu ayarının etkinleştirme sekmesi

Aktivasyon sekmesi, bazı parametreleri etkinleştirmenizi/devre dışı bırakmanızı sağlar. İşaretlemeniz gereken en önemli kutu, galeriniz için ışık kutusunu etkinleştiren Işık Kutusu İşlevini Etkinleştir'dir . Bu kutucuğu seçmezseniz diğer bölümlerin hepsi anlamsızdır.

Kutuların geri kalanı sizin için isteğe bağlıdır. Lightbox'ı ana sayfanızda, tek gönderilerde, sayfalarda, arşiv sayfalarında, widget'larda ve menülerde görüntülemek için işaretleyebilirsiniz.

Doğru bölümler için gerçekten ışık kutusu istediğinizden emin olun çünkü çok fazla ışık kutusu web sitenizi biraz gösterişli hale getirebilir.

Basit Işık Kutusu ayarının gruplandırma sekmesi

Aşağı kaydırdığınızda, Gruplandırma sekmesi var. Lightbox'ı bir kaydırıcı veya tek bir görüntü biçiminde görüntüleme şeklinize karar verecektir.

Öğeleri gruplandır : Bir resimden diğerine geçmenizi sağlayan bir kaydırıcı gibi resminizi/galerinizi görüntülemek için işaretleyin . Yalnızca bu özelliği açtığınızda, bu sekmedeki diğer bölümler etkili olabilir. Aksi takdirde, diğer gruplama bölümleri çalışmaz.

Öğeleri Gönderiye Göre Grupla: Bu kutuya bir işaret vererek, tüm öğeleri tek bir gönderiden bir ışık kutusu kaydırıcısına gruplamış olursunuz. Yalnızca bir gönderi içindeki resimleri/galerileri gruplamak ve diğer resimleri/galerileri diğer gönderilerden, widget'lardan ve menülerden hariç tutmak istediğinizde yapın.

Galeri öğelerini ayrı olarak gruplayın, Widget öğelerini ayrı olarak gruplayın ve Menü öğelerini ayrı olarak gruplayın : sırasıyla tek bir gönderi galerisindeki öğeleri, bir widget'taki öğeleri veya menü öğelerini gruplamak için her birine bir onay işareti koyun. Bu, ışık kutusu kaydırıcısındaki aynı galeri, widget veya menüdeki sonraki öğelere gidebileceğiniz anlamına gelir. Ziyaretçilerinizin kafasını karıştırabilecek farklı bölümlerdeki lightbox'ları karıştırmak istemiyorsanız bunu yapmanız gerektiğini düşünüyoruz.

Basit Işık Kutusu Ayarının Kullanıcı Arayüzü Sekmesi

UI sekmesinde, ışık kutusu stilini değiştirmek için bölümler bulunur. Lightbox ekranınızı özelleştirmek istiyorsanız buna dikkat edin.

Tema: Lightbox'ınız için 2 stil vardır. Sadece zevkinize uygun olanı seçin.

karanlık stil

ışık tarzı

Işık kutusunu pencereye sığacak şekilde yeniden boyutlandırın: Güzel bir görüntü elde etmek için bu bölümü açmanızı şiddetle tavsiye ederiz. Aksi takdirde görüntü tam ekran olur ve görüntünün tamamını bu şekilde izleyemezsiniz.

Animasyonları etkinleştir: yükleme efektini etkinleştirmek için işaretleyin.

Efekti devre dışı bırakmak, gezinmeyi daha hızlı hale getirmek için işareti kaldırın.

Slayt Gösterisini Otomatik Olarak Başlat: Bu bölümü etkinleştirdiğinizde otomatik olarak bir sonraki resme geçmesine izin verin.

Slayt Süresi: Yukarıdaki otomatik slayt gösterisi bölümünü açarsanız, slayt süresini buradan seçebilirsiniz.

Öğeler arasında geçiş yapın: Bir slayttan sonra öğeleri tekrarlamak ister misiniz? Evet ise, bu kutuyu tıklayın.

Kaplama Opaklığı (0 – 1): Arka plan kaplama opaklığını değiştirebilirsiniz. Opaklık ne kadar düşükse, arkasındaki gönderiyi o kadar net görebilirsiniz. Örneğin, arka planın gerçekten net bir şekilde görülebilmesi için opaklığı 0,1 olarak ayarladık.

Varsayılan başlığı etkinleştir: Bu kutuya tıklayarak resmin başlığını görüntülemeyi seçebilirsiniz. İşte başlığın nasıl gösterildiği.

Basit Işık Kutusunun Etiket Sekmesi

Son olarak, bu sekme her bir düğmenin etiketini değiştirmenize izin verecektir. Ancak temayı düzenlerken kısa kod eklemediğiniz sürece bu bölümler etkili olmaz. Bu nedenle, yeni başlayanlar için bu eğitimde, bu sekmeyle uğraşmanıza gerek yok.

Simple Lightbox eklentisinin tüm ayarlarını tamamladığınızda, Etiket sekmesinin hemen altındaki Değişiklikleri Kaydet'e tıklayın.

3. Adım: Lightbox'ı Görüntülemek için görüntüleri/galeriyi Medya Dosyasına bağlayın

Hangi görseli/galeriyi ışık kutusu ekleyeceğinize karar vermek için, o görsele/galeriye medya dosyası bağlantısı eklemelisiniz. Medya dosyasına bağlantı eklemezseniz, ışık kutusu gösterilemez.

“Temanız Destekliyorsa Lightbox Görüntüle” bölümünde bahsettiğimiz kılavuzu takip etmeniz yeterli. Görüyorsunuz, Simple Lightbox eklentisini kullanmak istiyorsanız kesinlikle nasıl yapacağınızı bilmeniz gerektiğini söyledik.

son sözler

Yukarıda, WordPress web sitenize ışık kutusu eklemenin en kolay yolu verilmiştir. Özellikle yeni başlayan biriyseniz, Simple Lightbox eklentisini kullanmak basit ve etkili bir yoldur. İsteğinize, web sitenize ve estetiğinize bağlı olarak, en çok istenen sonucu elde etmek için farklı lightbox eklentisi seçebilirsiniz. Veya lightbox'ı destekleyen bir WordPress teması bulmayı seçebilir ve bu efekti gösterecek şekilde yapılandırabilirsiniz.

Karmaşık ışık kutusu eklentileri hakkında daha fazla talimat istiyorsanız, aşağıya bir yorum bırakın ve bizi takip etmeye devam edin.