Divi Arşiv Sayfalarınıza Duvar Düzeni Nasıl Verilir?
Yayınlanan: 2021-09-15Arşiv sayfalarınıza özel bir duvar düzeni vermek için özel bir dinamik arşiv sayfası şablonu tasarlamak için Divi tema oluşturucusunu kullanabiliriz. Divi'de, Divi Tema Oluşturucu günlerinden önce geliştiriciler, bir arşiv sayfası şablonu tema dosyasındaki PHP kodunu manuel olarak özelleştirmeye ve ardından sayfa şablonunu yalnızca harici CSS ile şekillendirmeye güvenmek zorundaydı. Bu, bir duvar düzeni oluşturmayı çok daha zor hale getirdi. Ama şimdi Divi Theme Builder ile bu süreç kolay ve keyifli hale geldi!
Bu eğitimde, arşiv sayfası başlığını, alt başlığını ve blog gönderilerini dinamik olarak görüntüleyen bir arşiv sayfası şablonunun nasıl oluşturulacağını göstereceğiz. Ve blog gönderi modülünü kullanarak gönderi arşivimizi bir duvar ızgarası düzeninde kolayca görüntüleyebiliriz.
Başlayalım!
Gizlice Bakış
İşte bu eğitimde birlikte tasarlayacağımız arşiv sayfası şablonuna hızlı bir bakış. Bu resimde, “WordPress” kategorisine sahip tüm gönderileri görüntülemek için kullanılmaktadır.
ÜCRETSİZ Arşiv Sayfası Şablonunu İndirin
Bu eğitimdeki şablona el koymak için önce aşağıdaki düğmeyi kullanarak şablonu indirmeniz gerekir. İndirmeye erişmek için aşağıdaki formu kullanarak Divi Daily e-posta listemize abone olmanız gerekir. Yeni bir abone olarak, her Pazartesi daha da fazla Divi iyiliği ve ücretsiz bir Divi Düzen paketi alacaksınız! Zaten listedeyseniz, aşağıya e-posta adresinizi girin ve indir'i tıklayın. "Yeniden abone olmayacaksınız" veya fazladan e-posta almayacaksınız.
Ücretsiz İndir
Divi Bültenine katılın ve size nihai Divi Açılış Sayfası Düzen Paketinin bir kopyasını ve ayrıca tonlarca başka şaşırtıcı ve ücretsiz Divi kaynağı, ipucu ve püf noktası e-posta ile gönderelim. Takip edin ve kısa sürede bir Divi ustası olacaksınız. Zaten aboneyseniz, e-posta adresinizi aşağıya yazın ve düzen paketine erişmek için indir'i tıklayın.
Başarıyla abone oldunuz. Aboneliğinizi onaylamak ve haftalık ücretsiz Divi düzen paketlerine erişmek için lütfen e-posta adresinizi kontrol edin!
Şablon düzenini web sitenize aktarmak için Divi Tema Oluşturucu'ya gitmeniz ve .json dosyasını tema oluşturucuya aktarmak için taşınabilirlik seçeneğini kullanmanız gerekir.
Hadi öğreticiye geçelim mi?
Başlamak için Gerekenler
Başlamak için aşağıdakileri yapmanız gerekir:
- Henüz yapmadıysanız, kurulu Divi Temasını (veya Divi Temasını kullanmıyorsanız Divi Builder Eklentisini) kurun ve etkinleştirin.
- Bir arşiv sayfası şablonu oluşturacağımız için, sonuçları görmek istiyorsanız, web sitenizde yazarlar, kategoriler ve/veya bunlara atanmış etiketlerle önceden oluşturulmuş bazı blog yazılarına ihtiyacınız olacak.
Bundan sonra, gitmeye hazırsınız.
Arşiv Sayfası Şablonları için Kullanılabilen Modülleri ve Dinamik İçeriği Anlama
Bir Divi sitesi için bir arşiv sayfası şablonu oluştururken, doğru bilgileri dinamik olarak görüntüleyen bir şablonu etkili bir şekilde oluşturabilmeniz için hangi araçların emrinizde olduğunu anlamak önemlidir. Bir arşiv sayfası şablonu için en çok, bir kullanıcı bir arşiv sayfasını her ziyaret ettiğinde mevcut sayfanın gönderilerini görüntülemekle ilgileniriz. Örneğin, bir kullanıcı "İşletme" kategori bağlantısını tıklarsa, "İşletme" kategorisine sahip tüm gönderileri görüntüleyen bir arşiv sayfası görmelidir. Bazı Divi modüllerinde, bir şablonda dinamik içeriğin görüntülenmesini kolaylaştıran yerleşik seçenekler bulunur.
Blog Modülü
Blog Modülü, Arşiv Sayfası şablonlarını görüntülemek için kullanılması gereken birincil modüldür. Bunun nedeni, Geçerli Sayfa için Gönderileri görüntülemek için yerleşik bir seçeneğe sahip olmasıdır.
Bu temelde Divi'ye, bir kullanıcı sayfayı her ziyaret ettiğinde normalde oluşturulan gönderileri görüntülemesini söyler. Bu nedenle, "Mevcut Sayfa için Gönderiler" seçeneğinin görüntülenmesiyle, kullanıcı bir arşiv sayfasını görüntüleyebilir ve o geçerli sayfa için gönderilerin doğru bir şekilde görüntülenmesini sağlayabilir.
Gönderi/Arşiv Başlığı (Dinamik İçerik)
Gönderi/Arşiv Sayfa Başlığını görüntülemenin daha kolay bir yolu, normal bir Divi modülü kullanmak ve ardından tüm Divi modüllerinde bulunan dinamik içerik özelliğini kullanarak Gönderi/Arşiv Sayfa Başlığını çekmektir.
Örneğin, bir metin modülü kullanabilir ve ardından gönderi/arşiv sayfası başlığını gövde içeriğine dinamik içerik olarak ekleyebilirsiniz. Ardından başlığı istediğiniz gibi şekillendirebilirsiniz.
Artık bir arşiv sayfası şablonu oluşturmak için gereken araçları anladığınıza göre, birlikte bir tane oluşturalım.
Duvar Düzeni ile Divi Arşiv sayfası Şablonu Nasıl Oluşturulur
Duvar düzenine sahip bir arşiv sayfası şablonu oluşturmak için tek yapmanız gereken, tema oluşturucuyu kullanarak tüm arşiv sayfaları için yeni bir şablon tasarlamaktır.
Tüm Arşiv Sayfaları İçin Özel Şablon Oluşturma ve Atama
Başlamak için WordPress Kontrol Panelinize gidin ve Divi > Tema Oluşturucu'ya gidin. Ardından yeni bir şablon eklemek için boş gri kutu alanını tıklayın.
Ardından şablonu Tüm Arşiv Sayfalarına atayın.
Şablona Yeni Özel Vücut Alanı Ekleme
Şablon için özel gövde oluşturmak için Özel Gövde Ekle alanını tıklayın ve ardından “Özel Gövde Oluştur” seçeneğini seçin.
Ardından “Sıfırdan Oluştur” seçeneğini seçin.
Dinamik Arşiv Başlığı Ekle
Şablon Düzeni Düzenleyicisi'nde, varsayılan bölüm ayarlarını bir arka plan rengiyle güncelleyin.
- Arka Plan Rengi: #eeeeee
Ardından normal bölümün içinde yeni bir tek sütunlu satır oluşturun.
Ardından satıra bir metin modülü ekleyin.
Varsayılan gövde içeriğini silin ve "Dinamik İçeriği Kullan" simgesine tıklayın ve "Posta/Arşiv Başlığı" seçeneğini seçin.
Gönderi/Arşiv Başlığı öğesi yerleştirildiğinde, dişli simgesine tıklayarak ayarları açın.
Ardından, içeriği bir H1 etiketine sarmak için Önce ve Sonra giriş alanlarını güncelleyin ve aşağıdaki gibi dinamik başlıktan sonra ek bir statik içerik parçası ekleyin:
Önce:
<h1>
Sonrasında:
</h1>
SEO amacıyla başlığı bir H1 etiketine sarmamız gerekiyor.
Stil Dinamik Arşiv Başlığı
Dinamik içerik yerleştirildikten sonra, aşağıdakileri kullanarak stil verebiliriz:
- Başlık Yazı Tipi: Mulish
- Başlık Yazı Tipi: Ağırlık: Ağır
- Başlık metni Hizalama: Merkez
- Başlık Metni Rengi: #3a405a
- Başlık Metni Boyutu: 70px (masaüstü), 40px (tablet ve telefon)
Dinamik Arşiv Alt Başlık Metni Ekle
Dinamik arşiv sayfası başlığımızı özel HTML ile sarabildiğimiz için, alt yazı metni içinde dinamik arşiv sayfası başlığını çeken bir alt yazı ekleyebiliriz.
Bunu yapmak için önceki metin modülünün altında başlıklı yeni bir metin modülü oluşturun.
Varsayılan gövde metnini silin ve gönderi/arşiv başlığı dinamik içeriğini gövdeye ekleyin (tıpkı daha önce yaptığımız gibi).
Gönderi/arşiv başlığı ayarlarını açın ve içerikten önce ve sonra aşağıdakileri ekleyin.
Önce:
<h3>Here are the articles on
Sonrasında:
</h3>
Şimdi başlık, önceki metin satırına göre görüntülenecektir.
Stil Dinamik Arşiv Başlığı
Dinamik içerik yerleştirildikten sonra, aşağıdaki H3 ayarlarını güncelleyerek stil verebiliriz:
- Başlık 3 Yazı Tipi: Mulish
- Başlık 3 metni Hizalama: Merkez
Geçerli Sayfa için Gönderileri Dinamik Olarak Görüntülemek için Blog Modülünü Kullanma
Dinamik arşiv sayfası başlığı yerindeyken, mevcut arşiv sayfasının gönderilerini görüntülemek için blog modülünü eklememiz gerekiyor.
Yeni Bölüm Ekle
Blog modülünü eklemeden önce sayfaya yeni bir bölüm ekleyelim.
Yeni Tek Sütunlu Satır Ekle
Ardından, yeni bölüme yeni bir tek sütunlu satır ekleyin.
Ardından satır ayarlarını açın ve aşağıdakileri güncelleyin:
- Özel Oluk Genişliğini Kullan: EVET
- Oluk Genişliği: 2;
- Genişlik: %95
Geçerli Sayfa için Gönderileri Dinamik Olarak Görüntülemek için Blog Modülü Ekle
Şimdi satıra bir blog modülü eklememiz gerekiyor.
Unutmayın, arşiv sayfasının doğru gönderi arşivini çekmesi için Geçerli Sayfa için Gönderiler'in etkinleştirildiğinden emin olmalıyız. İçerik seçeneklerini aşağıdaki gibi güncelleyin:
- Mevcut Sayfa için Gönderiler: EVET
Tasarım Blog Modülü
İçerik ayarları yerindeyken, tasarımda bazı değişiklikler yapalım. Tasarım sekmesi altında düzeni aşağıdaki gibi güncelleyin:
- Düzen: Izgara
Şimdi içerik sekmesine geri dönün ve ızgara öğelerine aşağıdaki arka plan rengini ekleyin:
- Arka Plan Rengi: #3a405a
Başlık Metin Stillerini Güncelle
- Başlık Fontu: Mulish
- Başlık Yazı Tipi Ağırlığı: Kalın
- Başlık Metin Rengi: #eee
- Başlık Metin Boyutu: 34px
- Başlık Satırı Yüksekliği: 1.3em
Gövde Metni Stillerini Güncelle
- Gövde Yazı Tipi: Montserrat
- Gövde Metni Rengi: #ffffff
- Gövde Çizgisi Yüksekliği: 2em
Meta Metin Stillerini Güncelle
- Meta Yazı Tipi: Montserrat
- Meta Metin Rengi: #ffb100
Sayfalandırma Stillerini Güncelle
- Sayfalandırma Yazı Tipi Ağırlığı: Kalın
- Sayfalandırma Metin Rengi: #3a405a
Bu noktada, mevcut arşiv sayfası için gönderileri dinamik olarak gösterecek olan sayfa başlığı ve blog gönderileri (duvar düzeninde) ile tamamlanmış arşiv sayfası şablonumuzu hazır ve çalışır durumda tutuyoruz.
Son sonuç
Sonuçları test etmek için sitenizdeki farklı türdeki arşiv sayfalarını ziyaret edin.
İşte "WordPress" kategorisi için tüm gönderileri gösteren bir kategori arşiv sayfası şablonu örneği.
İşte belirli bir yazar için tüm gönderileri gösteren bir yazar arşiv sayfası şablonu.
İşte “Haberler” etiketine sahip tüm gönderileri gösteren bir etiket arşiv sayfası.
Ve işte, 2019 Ekim ayı için tüm gönderileri gösteren bir tarih arşivi sayfası şablonu.
Son düşünceler
Divi'nin tema oluşturucusu ile yeni bir arşiv şablonunun nasıl oluşturulacağını öğrendikten sonra, gönderiler için bir duvar düzeni eklemek kolaydır. İşin püf noktası, arşiv sayfası başlığını dinamik içerik olarak görüntülemek için Divi'nin yerleşik seçeneklerini kullanmak ve ardından geçerli sayfanın gönderisini bir duvar ızgara düzeninde dinamik olarak görüntülemek için blog modülünü kullanmaktır. Umarım bu, kolayca gözden kaçabilecek arşiv sayfalarını hedefleyerek web sitenizin genel tasarımını artırmaya yardımcı olur.
Yorumlarda sizden haber bekliyorum.
Şerefe!