Divi 5'in Loop Builder ve Pagination Modülü Birlikte Nasıl Kullanılır

Bu yayınların seçilmiş ve sınırlı bir setini gösteriyorsanız, post -içeriğin statik listeleri iyidir. Ancak çoğu zaman, kullanıcıların orijinal döngü gösterilerinizden daha fazla içeriğe erişmelerini istersiniz. Başlangıçta ne kadar içerik yüküne karar vermek ve okuyuculara gruplar arasında hareket etmenin net bir yolunu sunmak istiyorsunuz. Divi 5'in Döngü Oluşturucu ve Sayfa Modülü mükemmel bir çift oluşturuyor.

Bu yazı, her birinin nasıl çalıştığı konusunda size yol gösterecek, sonra bunları nasıl bağlayacağınızı gösterecektir. Sonunda, uygun sayfalama ile ilmekli düzenler nasıl oluşturulacağını bileceksiniz.

Divi 5'in Loop Builder ile tanışın

Loop Builder, Divi 5'in en büyük yükseltmelerinden biridir. Size eski blog modülünün asla yapamayacağı özgürlüğü verir. Herhangi bir öğe “ilmekli” bir kap olabilir. Bu, Divi'nin sorgunuza uygun her yazı, ürün veya özel posta türü için otomatik olarak tekrarlayacağı anlamına gelir.

Önceden tasarlanmış bir yayın listesine takılmak yerine, bir “şablon” öğesini döngü olarak tasarlarsınız. Divi bunu her sonuç için kullanır, dinamik içerikte döngü sorgusundan değiştirilir. Bu olabilir:

• Post verilerinden çekilen başlıklar
• Özellikli resimler
• Özel alanlar
• Tam yayınlara veya ürünlere bağlantılar

Herhangi bir modülü yalnızca bloga özgü bir modülü görüntülemek için kullanabilirsiniz. En son kurs listelerinizi gösteren süslü bir bulanıklık modülü ister misiniz? Tamamlamak. WooCommerce ürünleri için özel bir ürün kartı düzenine mi ihtiyacınız var? Ayrıca bitti.

Esnek çünkü tasarım ve içerik yapısını kendiniz inşa ediyorsunuz. Divi tekrarını ele alır.

Blog modülünden döngü oluşturucuya geçiş, standart bir şablondan tamamen özelleştirilebilir bir düzen sistemine geçmek anlamına gelir. Onunla inşa etmekten gerçekten keyif aldım ve ben de olacağını biliyorum!

Sayfa modülünü karşılayın

Pagination, “sonuçları sayfalara bölün” demenin süslü bir yoludur. Tüm öğeleri tek bir sayfaya dökmek yerine, bunları daha küçük setlere ayırırsınız. Bu yardımcı olur:

• Sayfa Yükleme Süreleri
• Okunabilirlik
• Tarama

Divi 5'teki Pagination Modülü tam olarak bunu yapıyor, ancak bazı akıllı entegrasyonla. Yalnızca blog yayınlarına bağlı değildir. Bunun yerine, sayfada oluşturduğunuz herhangi bir döngüye bağlanabilir.

Etiketleri özelleştirebileceğiniz iki navigasyon öğesi (belirgin ve sonraki bağlantılar) ekleyerek çalışır. Mevcut setin ötesinde eski öğeler varsa, “eski” (veya seçtiğiniz metin) etkin olacaktır. Daha yeni öğeler varsa, “daha ​​yeni” aktif olacaktır.

Bir Döngü + Pagination Düzeni Oluşturma

Tam kurulumdan geçelim. Bu örnek, altında sayfalandırılmış özel bir döngü istediğinizi varsayar. İşte döngümüzü gösterecek esnek düzeni. Tam olarak üretilmiş düzeni aşağıda indirebilirsiniz.

Kartın ~% 50 genişlik ve esnek büyüme olarak ayarlandığını unutmayın, bu nedenle ilmekli bir kart kendi başına esnek bir sırada olduğunda, kabının içinde tam genişlik haline gelecektir.

Adım 1: Döngü konteynerini oluşturun

Sayfanıza bir bölüm ekleyin. İçinde, tekrarlamak istediğiniz modülleri ekleyin. Bu, tek bir modül (bir bulanıklık gibi) veya bir sütun veya gruptaki çoklu modüllerin daha karmaşık bir düzeni olabilir.

Konteyner seçilirken ayarlarını açın ve döngü seçeneğini etkinleştirin.

Veri kaynağınızı seçin. Bu, döngü çalıştıracağı “sorgu” dır.

İlk olarak, sorgu türünü seçin. Web sitenizin yapılandırmasına bağlı olarak şu seçenekleri görebilirsiniz:

• Gönderi türü (blog yayınlarınız veya 'Projeler' gibi özel yayın türleri gibi)
• Terimler (kategoriler ve taksonomiler)
• Kullanıcılar (yazarlar gibi site kullanıcılarının bir listesini döndürün)
• Tekrarlayıcı alanı (bir döngü içinde bir döngü oluşturmak için bir eklenti tarafından oluşturulan özel bir alan)

Daha sonra, yukarıda ne tür bir sorgu seçtiğinize bağlı olarak, daha spesifik olma şansınız olacak. “Gönderme Türünü” seçmek, bu tür gönderi türlerini şu şekilde kullanmanıza izin verebilir:

• Blog gönderileri
• Projeler
• Ürünler
• Kendiniz için özel olarak oluşturulduğunuz CPT

Oradan, döngünüzde görünmesi gereken konusunda daha da spesifik olabilirsiniz. Yapabilirsiniz:

• Belirli bir kategoriye veya etiket içeren öğeleri ekleyin
• Belirli bir kategoriye veya etiketle öğeleri hariç tutun
• Belirli öğeleri ekleyin (Post kimliğiyle)
• Belirli öğeleri hariç tutun (Post kimliğine göre)
• Kendi Meta sorgunuzu oluşturun (özel alan verilerine dayalı kapsayıcılar/istisnalar oluşturmak için kullanışlıdır)
• Eşleştirme sorgularının sırasını ayarlayın (alfabetik ve azalan gibi)
• Sayfa değeri başına öğeler, kaçının döngüde göründüğünü kontrol eder
• Döngüde daha sonra döngünüzü başlatmak isterseniz ofset gönderin
• Yapışkan Mesajları Yoksay

Örneğimiz bu noktaya böyle bakar. Döngüyü oluşturduk ve Blog Gönderi Posta Türümüze atadık. Ekran sınırını 3'e ayarladım.

Şimdi, dinamik döngü içeriğiyle köprü kurmak istediğimiz çeşitli metin alanlarını ve öğeleri atamalıyız.

2. Adım: Döngü içine dinamik içerik ekleyin

Bir sonraki görevimiz, döngü modüllerinin her birini tıklamak ve statik metin veya görüntüleri dinamik içerik alanlarıyla değiştirmektir. Örneğin:

• Bir metin modülünde, dinamik içerik seçicisinden "Post başlığı" yı seçin
• Bir görüntü modülünde, "Öne çıkan resim" ü seçebilirsiniz.
• Bir düğme modülünde, bağlantıyı "Post URL" olarak ayarlayın
• Döngülü kapsayıcıda, “URL Post” ile bağlantıyı da ayarlayın.

Bu, Divi'ye her döngüsel öğe için doğru içeriği çekmesini söyler.

Unutmayın - her sonuç için döngü içindeki her şey tekrarlanır. Döngü olmayan içeriği (başlıklar, reklamlar veya CTA'lar gibi) dışında tutun. Döngüde dinamik verilerle bağlantılı olmayan bir içerik parçası varsa, döngüdeki her öğe bunu olduğu gibi görüntüleyecektir (örnek kartın sağ altındaki “Okuma →” metni gibi).

Adım 3: Sayfa modülünü ekleyin

Döngü bölümünüzün altına yeni bir satır ekleyin. Sayfa modülünü takın. Modülün ayarlarında, hedef alanı bulun. Sayfadaki bir açılır döngü listesinden döngünüzü seçmek için kullanın. Bu, sayfalandırma kontrollerini o spesifik döngüye bağlar. Profesyonel ipucu: Yönetici etiketlerini kullanıyorsanız, doğru hedefi seçmek daha kolaydır. Bu da etkileşimler için geçerli.

“Önceki” ve “Sonraki” etiketlerini özelleştirin. Minimum stil için “eski yayınlar / yeni yayınlar”, “geri / ileri” veya hatta “← / →” kullanabilirsiniz.

Anahtar, sayfalandırma modülünün kontrol ettiği döngü dışında oturması gerektiğidir. Bu ve doğru hedefe atandığından emin olmak (aynı sayfada/şablonda birden fazla döngü varsa).

4. Adım: Etkileşimi test edin

Sayfanızı kaydedin ve önizleyin. Bir sonraki döngü öğe setine gitmek için “Eski” yi tıklayın.

URL'nin döngü sayfasını tanımlayan bir sorgu parametresi ile nasıl değiştiğini unutmayın. Ayrıca yalnızca döngü içeriğinin karıştırıldığını/değişikliklerinin - başlıklar, altbilgiler ve kenar çubukları aynı kalması gerektiğini unutmayın.

Bu döngü düzenini alın

Bu düzeni incelemek ve işlerin kendiniz için nasıl inşa edildiğini görmek ister misiniz? Buradan indirin!

Klasörünüzü açtıktan sonra, dosyayı yüklemek için Divi kitaplığınıza gidin. Yüklendikten sonra, bu bölümü üzerinde çalıştığınız herhangi bir sayfaya ekleyebilirsiniz.

Dosyaları İndirin

Ücretsiz indir

Divi bültenine katılın, size Ultimate Divi açılış sayfası düzen paketinin bir kopyasının yanı sıra tonlarca şaşırtıcı ve ücretsiz divi kaynakları, ipuçları ve püf noktalarının bir kopyasını e -postayla göndereceğiz. Takip et ve hiçbir zaman bir divi ustası olacaksınız. Zaten abone olduysanız, aşağıdaki e -posta adresinizi yazın ve Düzen Paketine erişmek için İndir'i tıklayın.

İNDİRMEK

Başarılı bir şekilde abone oldunuz. Aboneliğinizi onaylamak için lütfen e -posta adresinizi kontrol edin ve ÜCRETSİZ Haftalık Divi Düzen Paketlerine erişin!

Daha dinamik bir divinin tadını çıkarın

Divi 5'in Döngü Oluşturucu ve Sayfa Modülü esneklikte büyük bir sıçrama. Döngü oluşturucu sizi eski modüllerin sert tasarımlarından kurtarır ve dinamik içeriğe sahip kendi tekrarlanan düzenlerinizi oluşturmanıza izin verir. Sayfa modülü, bu düzenleri kullanıcı dostu parçalara ayırarak hızlı ve yönetilebilir tutar.

Diğer yeni Divi 5 özellikleri (Flexbox, etkileşimler, HSL renk kontrolleri) ile eşleştirilen döngü oluşturucu ve sayfalandırma modülü, her zamanki gibi güçlüdür. Tüm bunlarla inanılmaz sayfa tasarımları yapabilirsiniz.

İlk Painline Loop'unuzu oluşturduktan sonra, bloglar, ürün şebekeleri, portföyler veya düzenlemeniz gereken herhangi bir içerik türü boyunca yaklaşımı yeniden kullanmanın ne kadar kolay olduğunu göreceksiniz.