Divi'de bir görüntü koleksiyonunu paylaşmak, kullanıcıların içeriğinizle görsel olarak etkileşim kurması için her zaman harika bir yoldur. Divi'nin Galeri modülü, web sitenizin herhangi bir yerinde galeriler oluşturmanıza ve düzenlemenize olanak tanır. Divi Builder'daki galeri modülü, ızgara ve kaydırıcı biçiminde mevcuttur ve sayfalandırmalı büyük galerileri destekler.
Sayfanıza galeri modülü nasıl eklenir
Sayfanıza bir galeri modülü eklemeden önce Divi Builder'a atlamanız gerekir. Bir kere Divi teması web sitenize yüklediğinizde bir düğme göreceksiniz Divi Builder'ı Kullan yeni bir sayfa oluşturduğunuzda yayın düzenleyicisinin üzerinde. Divi Builder'ı etkinleştirmek ve tüm Divi Builder modüllerine erişmek için bu düğmeye tıklayın. Ardından düğmeye tıklayın Visual Builder'ı kullan Jeneratörü görsel modda başlatmak için. Düğmeye de tıklayabilirsiniz Visual Builder'ı kullan WordPress panonuza bağlıysanız, web sitenizi ön planda tuttuğunuzda.
Visual Builder'a girdikten sonra, sayfanıza yeni bir modül eklemek için gri artı düğmesini tıklayabilirsiniz. Yeni modüller yalnızca satırların içine eklenebilir. Yeni bir sayfaya başlıyorsanız, önce sayfanıza bir satır eklemeyi unutmayın. Öğelerini kullanma konusunda harika öğreticilerimiz var hatları ve bölümler Divi tarafından.
Modüller listesinde galeri modülünü bulun ve sayfanıza eklemek için üzerine tıklayın. Modül listesi aranabilir, yani "galeri" kelimesini yazabilir ve ardından galeri modülünü otomatik olarak bulup eklemek için enter'a tıklayabilirsiniz! Modül eklendiğinde, modül seçenekleri listesi tarafından karşılanacaksınız. Bu seçenekler üç ana gruba ayrılmıştır: içindekiler , Gebe kalma et gelişmiş .
Örnek kullanım durumu: Fotoğrafı sergilemek için tam genişlikte bir resim galerisi ekleme.
Fotoğrafçılık sayfanıza bir galeri eklemek harika bir yoldur. desteklemek Çalışmanızı ve müşteriler nezdindeki güvenilirliğinizi artırın. Bu örnekte, sayfanın tüm genişliğini kapsayan ızgara düzenine sahip bir resim galerisi eklemek için galeri modülünü nasıl kullanabileceğinizi göstereceğim. Görsellerin arasında boşluk olmaması pratik ve estetik bir sunum sağlıyor.
Ve her görüntünün, galerideki görsellerin daha büyük sürümleri arasında geçiş yapmak için bir açılır pencere açtığını da unutmayalım.
Visual Builder'ı kullanarak, başlık bölümünün altına tam genişlikte veya tam genişlikte (1 sütun) satır içeren yeni bir bölüm ekleyin. Ardından Galeri modülünü satıra ekleyin.
Galeri modülü ayarlarını aşağıdaki şekilde güncelleyin:
İçerik seçenekleri
Galeri Resimleri: Güncellenen galeriye tıklayın ve galeriye eklemek istediğiniz resimleri seçin. Görüntü sayısı: 12 Ekran başlığı ve başlığı: YOK Görüntü Sayfalandırma: YOK
Tasarım seçenekleri
Düzen: Izgara Küçük resim yönü: Yatay Yakınlaştırma simgesi Renk: #ffffff Fareyle üzerine gelme rengi: rgba (0,0,0,0.48) Fareyle Üzerine Gelme Simgesi Seçici: varsayılan
Ayarları kaydet
Artık tek yapmanız gereken, görüntülerin etrafındaki tüm boşluklardan kurtulmak. Geri dönün ve satır ayarlarını seçin. Tasarım sekmesinde aşağıdakileri güncelleyin:
Bu satırı tam genişlik yap: YES
Özel oluk genişliğini kullanın: YES
Oluk genişliği: 1
Cilt payı genişliği için "1" sayısal değerinin gerçekten sıfır olduğunu (hiç genişlik yok) hatırlamak önemlidir.
Ayarları kaydet
İşte bu kadar!
Galeri modülünün içerik seçenekleri
İçerik sekmesinde, modülün metin, resimler ve simgeler gibi tüm içerik öğelerini bulacaksınız. Tüm kontroller ce qui modülünüzde beliren her zaman bu sekmede bulunur.
Galeri Resimleri
Güncelle düğmesini tıklayın gün galeri galeride görüntülemek istediğiniz görüntüleri seçebileceğiniz WordPress multimedya kütüphanesini başlatmak için.
Görüntü sayısı
Sayfa başına görüntülenecek resim sayısını ayarlayın. Galerinize her sayfada izin verilenden daha fazla resim eklendiğinde, sayfalandırma resimlerin altında görünecektir.
Başlığı ve başlığı göster:
Bir resim başlığı veya resim yazısı eklenmişse, galeride resmin altında görünecektir. Bu metin öğelerini devre dışı bırakmak istiyorsanız, bu seçeneği kullanarak bunu yapabilirsiniz.
Sayfalandırmayı görüntüle
Galerinize her sayfada izin verilenden daha fazla resim eklendiğinde, sayfalandırma resimlerin altında görünecektir. Sayfalamayı kaldırmak istiyorsanız, bu ayarı kapatabilirsiniz.
Yönetici Etiketi
Bu, kolay tanımlama için yapıcıdaki modül etiketini değiştirecektir. WireFrame görünümünü Visual Builder'da kullandığınızda, bu etiketler Divi Builder arayüzünün modül bloğunda görünür.
Galeri modülü tasarım seçenekleri
Tasarım sekmesinde yazı tipleri, renkler, boyutlandırma ve aralık gibi tüm modül stil seçeneklerini bulacaksınız. Bu, modülünüzün görünümünü değiştirmek için kullanacağınız sekmedir. Her Divi modülünde, herhangi bir şeyi değiştirmek için kullanabileceğiniz uzun bir tasarım ayarları listesi vardır.
hüküm
Varsayılan olarak, galeriler bir resim ızgarası olarak görüntülenir. Galerinizi bir resim kaydırıcısı olarak görüntülemeyi de seçebilirsiniz.
Küçük resim oryantasyonu
Galerinizdeki resimleri dikey veya yatay formatta almayı seçebilirsiniz. Modu değiştirirseniz, yapmanız gerekebilir. küçük resimlerinizi yeniden oluşturun .
Yakınlaştırma Renk Simgesi
Galeri bölmesindeki bir öğenin üzerine geldiğinizde bir kaplama simgesi belirir. Bu ayardaki renk seçiciyi kullanarak bu simgeden kullanılan rengi ayarlayabilirsiniz.
Fareyle üzerine gelin yer paylaşımı rengi
Galeri bölmesindeki bir öğenin üzerine geldiğinizde, görüntünün üst kısmında ve portföy başlık metni ve simgesinin altında bir kaplama rengi belirir. Varsayılan olarak yarı saydam bir beyaz renk kullanılır. Farklı bir renk kullanmak istiyorsanız, bu ayardaki renk seçiciyi kullanarak rengi ayarlayabilirsiniz.
Overflight Seçici Simgesi (Hover)
Burada, bir ziyaretçi modüldeki galeri öğelerinin üzerine geldiğinde görüntülenecek özel bir simge seçebilirsiniz.
Metin rengi
Burada metninizin açık mı yoksa koyu mu olacağını seçebilirsiniz. Koyu bir arka plan üzerinde çalışıyorsanız, metniniz açık olmalıdır. Arka planınız açıksa, metniniz koyu olmalıdır.
Başlık yazı tipi
Açılır menüden istediğiniz yazı tipini seçerek başlık metninizin yazı tipini değiştirebilirsiniz. Divi, Google Yazı Tipleri tarafından desteklenen düzinelerce harika yazı tipiyle birlikte gelir. Varsayılan olarak Divi, sayfanızdaki tüm metinler için Open Sans yazı tipini kullanır. Kalın, italik, büyük harf ve altı çizili seçenekleri kullanarak metninizin stilini de özelleştirebilirsiniz.
Başlık yazı tipi boyutu
Burada başlık metninizin boyutunu ayarlayabilirsiniz. Metninizin boyutunu artırmak veya azaltmak için aralık kaydırıcısını sürükleyebilir veya kaydırıcının sağındaki giriş alanına doğrudan istenen metin boyutunun değerini girebilirsiniz. Giriş alanları farklı ölçü birimlerini destekler; bu, birim türünü değiştirmek için beden değerinize bağlı olarak "px" veya "em" girebileceğiniz anlamına gelir.
Başlık metni rengi
Varsayılan olarak, Divi'deki tüm metin renkleri beyaz veya koyu gri olarak görünür. Başlığınızın metin rengini değiştirmek istiyorsanız, bu seçeneği kullanarak renk seçiciden istediğiniz rengi seçin.
Başlık harflerinin aralığı
Harf aralığı, her harf arasındaki boşluğu etkiler. Başlık metninizdeki her harf arasındaki boşluğu artırmak istiyorsanız, aralığı ayarlamak için aralık kaydırıcısını kullanın veya kaydırıcının sağındaki giriş alanına istenen boşluk boyutunu girin. Giriş alanları farklı ölçü birimlerini destekler; bu, birim türünü değiştirmek için beden değerinize bağlı olarak "px" veya "em" girebileceğiniz anlamına gelir.
Başlık satırının yüksekliği
Satır yüksekliği, başlık metninizin her satırı arasındaki boşluğu etkiler.Her satır arasındaki boşluğu artırmak istiyorsanız, aralığı ayarlamak için aralık kaydırıcısını kullanın veya giriş alanına istediğiniz boşluk boyutunu girin imlecin sağında bulunur. Giriş alanları farklı ölçü birimlerini destekler; bu, birim türünü değiştirmek için beden değerinize bağlı olarak "px" veya "em" girebileceğiniz anlamına gelir.
Legend yazı tipi
Açılır menüden istediğiniz yazı tipini seçerek başlık metninizin yazı tipini değiştirebilirsiniz. Divi, Google Yazı Tipleri tarafından desteklenen düzinelerce harika yazı tipiyle birlikte gelir. Varsayılan olarak Divi, sayfanızdaki tüm metinler için Open Sans yazı tipini kullanır. Kalın, italik, büyük harf ve altı çizili seçenekleri kullanarak metninizin stilini de özelleştirebilirsiniz.
Başlık yazı tipi boyutu
Burada altyazı metninizin boyutunu ayarlayabilirsiniz. Metninizin boyutunu büyütmek veya küçültmek için aralık kaydırıcısını sürükleyebilir veya kaydırıcının sağındaki giriş alanına doğrudan istenen metin boyutu değerini girebilirsiniz. Giriş alanları farklı ölçü birimlerini destekler; bu, birim türünü değiştirmek için beden değerinize bağlı olarak "px" veya "em" girebileceğiniz anlamına gelir.
Açıklama metin rengi
Varsayılan olarak, Divi'deki tüm metin renkleri beyaz veya koyu gri görünür. Altyazı metninizin rengini değiştirmek istiyorsanız, bu seçeneği kullanarak renk seçiciden istediğiniz rengi seçin.
Efsane harflerinin aralığı
Harf aralığı, her harf arasındaki boşluğu etkiler. Başlık metninizdeki her harf arasındaki boşluğu artırmak istiyorsanız, aralığı ayarlamak için aralık kaydırıcısını kullanın veya kaydırıcının sağındaki giriş alanına istenen boşluk boyutunu girin. Giriş alanları farklı ölçü birimlerini destekler; bu, birim türünü değiştirmek için beden değerinize bağlı olarak "px" veya "em" girebileceğiniz anlamına gelir.
Efsane hattının yüksekliği
Satır yüksekliği, başlık metninin her satırı arasındaki boşluğu etkiler.Her satır arasındaki boşluğu artırmak istiyorsanız, aralığı ayarlamak için aralık kaydırıcısını kullanın veya bulunan giriş alanına istenen boşluk boyutunu girin. imlecin sağında. Giriş alanları farklı ölçü birimlerini destekler; bu, birim türünü değiştirmek için beden değerinize bağlı olarak "px" veya "em" girebileceğiniz anlamına gelir.
Sınırı kullan
Bu seçeneğin etkinleştirilmesi, modülünüzün etrafına bir sınır koyacaktır. Bu sınır, aşağıdaki koşullu parametreler kullanılarak özelleştirilebilir.
Sınırın rengi
Bu seçenek, kenarlığınızın rengini etkiler. Kenarlığınıza uygulamak için renk seçiciden özel bir renk seçin.
Sınırın genişliği
Varsayılan olarak, kenarlıklar 1 piksel genişliğindedir. Aralık kaydırıcısını sürükleyerek veya kaydırıcının sağındaki giriş alanına özel bir değer girerek bu değeri artırabilirsiniz. Özel ölçü birimleri desteklenir; bu, varsayılan birimi "px" den em, vh, vw vb. Gibi başka bir şeye değiştirebileceğiniz anlamına gelir.
Sınır Stili
Kenarlıklar sekiz farklı stili destekler: düz, noktalı, noktalı, çift, oluk, sırt, kaplama ve başlangıç. Kenarlığınıza uygulamak için açılır menüden istediğiniz stili seçin.
Gelişmiş galeri modülü seçenekleri
Gelişmiş sekmesinde, özel CSS ve HTML özellikleri gibi daha deneyimli web tasarımcılarının yararlı bulabileceği seçenekler bulacaksınız. Burada, modülün birçok öğesinden herhangi birine özel CSS uygulayabilirsiniz. Ayrıca, alt temanızın style.css dosyasında modülü özelleştirmek için kullanılabilen modüle özel CSS sınıfları ve kimlikleri de uygulayabilirsiniz.
CSS Kimliği
Bu modül için kullanmak üzere isteğe bağlı bir CSS Kimliği girin. Kimlik, özel bir CSS stili oluşturmak veya sayfanızın belirli bölümlerine bağlanmak için kullanılabilir.
CSS sınıfı
Bu modül için kullanmak üzere isteğe bağlı CSS sınıflarını girin. Özel CSS stili oluşturmak için bir CSS sınıfı kullanılabilir. Bir boşlukla ayırarak birden çok sınıf ekleyebilirsiniz. Bu sınıflar, Divi alt temanızda veya Divi tema seçeneklerini veya Divi Builder sayfa ayarlarını kullanarak sayfanıza veya web sitenize eklediğiniz özel CSS stil sayfasında kullanılabilir.
Özel CSS
Özel CSS, modüle ve modülün herhangi bir dahili bileşenine de uygulanabilir. Özel CSS bölümünde, her öğeye doğrudan özel CSS stil sayfaları ekleyebileceğiniz bir metin alanı bulacaksınız. Bu ayarlardaki CSS girişleri zaten stil etiketlerine sarılmıştır. Bu yüzden CSS kurallarını noktalı virgülle ayırarak girin.
görünürlük
Bu seçenek, modülünüzün göründüğü cihazları kontrol etmenizi sağlar. Modülünüzü tabletlerde, akıllı telefonlarda veya masaüstlerinde ayrı ayrı devre dışı bırakmayı seçebilirsiniz. Bu, farklı cihazlarda farklı modlar kullanmak istiyorsanız veya sayfadan belirli öğeleri kaldırarak mobil tasarımı basitleştirmek istiyorsanız kullanışlıdır.
[vc_row center_row=”yes”][vc_column width=”1/2″][vcex_button target=”blank” layout=”genişletilmiş” align=”center” font_family=”Raleway” font_weight=”700″ style=”flat” custom_background=”#18b69d” custom_hover_background=”#118d7a” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]DIVI TEMASINI İNDİRİN [/vcex_button][/vc_column][vc_column width=” 1 /2"][vcex_button url=”https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=23065&url=40632&tid1=tutorials” target=”blank” layout=”genişletilmiş” align=”center” font_family = ”Raleway” font_weight=”700″ style=”flat” custom_background=”#c4226e” custom_hover_background=”#8d184f” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]YÜKLE ŞABLONLARI DIVI[/vcex_button][/vc_column][/vc_row]
Diğer Divi öğreticiler
- restoran kullanımı Divi tema için 5 siteleri
- Bir Divi WooCommerce ürününe metin ekleme
- Divi sayfaları arasındaki menü rengini değiştirme
- Bir blog'un ızgaralarını Divi ile kişiselleştirme
- Nasıl WordPress üzerinde rol Divi editörü kullanımı
- Tam ekran Divi sürgüsü nasıl oluşturulur
- Divi sayfaları arasındaki menünün rengi nasıl değiştirilir
- Divi hakkında muhtemelen bilmediğiniz özellikler
- WordPress üzerinde Divi Builder nasıl kullanılır
- Divi video kaydırma modülü nasıl kullanılır
- Divi Builder Flip modülü nasıl kullanılır
- Divi Builder'da referans modülü nasıl eklenir?
- Divi metin modülü nasıl kullanılır?
- Divi'de kaydırıcı nasıl oluşturulur
- Divi kullanıcı rolü nasıl düzenlenir
- Divi Sosyal Medya modülü nasıl kullanılır?
- WordPress Divi konulu mağaza modülü nasıl kullanılır?
- Divi kenar çubuğu modülü nasıl kullanılır
- Divi Fiyat Tablosu Modülünün Kullanımı
- Divi yayınlarının başlık modülünü nasıl kullanırım
- Divi video modülü nasıl eklenir
- Makale navigasyon modülü nasıl kullanılır
- Divi arama modülü nasıl kullanılır?
- Divi cüzdan modülü nasıl kullanılır?
- Divi Builder'da kişi modülünün kullanımı
- Divi filtreli cüzdan modülü nasıl kullanılır
- Tam genişlikte sürgü modülü nasıl kullanılır
- Divi Builder Görüntü Modülü nasıl kullanılır?
- Divi Builder'ın tam genişlikli gezinme modülünü nasıl kullanırım?
- Resim galerisi modülü nasıl kullanılır?
- Divi Builder Tam Genişlik Kart Modülü nasıl kullanılır?
- Divi Tam Genişlik Portföy Modülü nasıl kullanılır?
- Divi tam genişlikli başlık modülü nasıl kullanılır?
- Divi Sayaç Modülünün Kullanımı
- Divi Builder'daki makaleler sürgüsünü kullanma
- Divi Email Optin modülü nasıl kullanılır?
Merhaba, galeri seçeneği ilginç görünüyor. Bununla birlikte, resimlerimi belirli bir gruptan rastgele nasıl seçerim? Sitemdeki bir html/php sayfasını yalnızca wp/divi olacak şekilde değiştirmek istiyorum. Bir fikir ? php enjeksiyonu… diğer… Şimdiden teşekkürler. Aşağıdaki sitemin adresi, küçük resme tıklandığında bahsettiğim bu html/php sayfasına geri dönülür. Küçük resimlere (wordpress sayfası) dönmek için html/php slayt gösterisinin bir resmine tıklayın. Ve böylece, slayt gösterisi görüntüleri, rastgele seçim alanını her seferinde yenilenen 5 ile sınırlayan bir kodla bir veritabanında saklanır.
Doğrudan WP veritabanındaki bilgileri seçmek için başka bir WP sitesine kod enjekte etmek, işe yaramadan önce bunun kolay olmadığını hatırlıyorum… Siteniz için teşekkürler!
İyi akşamlar,
Bir DIVI galerisinde farklı boyuttaki görüntüleri dikey olarak ortalamak istiyorum.
Ne kadar baksam da bulamıyorum. bir ipucu var mı??
şimdiden teşekkürler.
Cdt
Merhaba, ancak aynı satırda 5 resme nasıl sahip olabilirim?
4'ten fazlasını alamıyorum!
Merci.
Merhaba,
Visual Composer veya Elementor gibi bir eklenti kullanmalısınız. Daha fazla olanak sunuyorlar.
Merhaba, makalelerinizi çok ilginç buluyorum.
Tavsiyenizi takiben Divi altında bir galeri oluşturdum ve resimlerimin altına kaydetmeyi önlemek için sağ fare tıklamasını nasıl kaldıracağımı bilmiyorum dışında her şey yolunda gidiyor. Şimdiden teşekkürler, çözümünüz var mı? candan
İyi akşamlar Bernard,
Sağ tıklamayı engellemek için bir eklenti yüklemeniz gerekir. Sizi WordPress dizininde aramaya davet ediyorum.