Divi'de Blog Sayfası İçeriğini Düzenlemek için 5 İpucu

Yayınlanan: 2019-12-21

Blog sayfanızın içeriği birçok şekilde düzenlenebilir. Bir blog sayfası olduğundan, içeriğin çoğu son blog yazılarından oluşan bir beslemeden oluşacaktır. Bu içeriği nasıl düzenleyeceğinizi bilmek, monotonluğu kırmanın ve daha benzersiz blog sayfası tasarımları için kapıyı açmanın harika bir yolu olabilir.

Bu eğitimde, aşağıdakileri öğrenmenize yardımcı olacak Divi'de blog sayfası içeriği düzenlemek için 5 yararlı ipucunu sizinle paylaşacağız:

  1. İki Sütun Düzeni Nasıl Oluşturulur
  2. Yapışkan Yazılar Nasıl Kullanılır
  3. Post ofsetleri nasıl kullanılır?
  4. Blog gönderileri için özel bir düzen oluşturmak için birden çok blog modülü nasıl kullanılır?
  5. Son gönderiler kategoriye göre nasıl görüntülenir?

Gizlice Bakış

Divi'de blog sayfası içeriğini düzenlemenin bazı yollarına bir göz atın.

İki Sütun Düzeni Kullanma

Divi'de blog sayfası içeriği düzenleme

Ana Blog Akışının Üstünde Öne Çıkan Bir Gönderi Bölümü

Divi'de blog sayfası içeriği düzenleme

Ana Blog Beslemesinin Üzerinde Tam Genişlikli Bir Gönderi Kaydırıcısı

Divi'de blog sayfası içeriği düzenleme

Benzersiz Bir Düzen ve Tasarım için Birden Fazla Blog Modülü Kullanma

Divi'de blog sayfası içeriği düzenleme

Kategoriye Göre Son Gönderiler

Divi'de blog sayfası içeriği düzenleme

Başlamak için Gerekenler

Henüz yapmadıysanız Divi Temasını kurun ve etkinleştirin.

Bu eğitim için İkinci Tema Oluşturucu Paketi Kategori Sayfası Şablonunu kullanacağım. Devam etmek için kullanmak istiyorsanız, paketi indirin ve taşınabilirlik seçeneklerini kullanarak divi-theme-builder-pack-2-category-page-template.json dosyasını tema oluşturucuya aktarın.
Divi'de blog sayfası içeriği düzenleme

Varsayılan olarak, içe aktarılan şablon "Tüm Kategori Sayfaları"na atanacaktır. Şablon ayarlarını açın ve Blog'a atayın.

Divi'de blog sayfası içeriği düzenleme

Divi'de blog sayfası içeriği düzenleme

Artık şablon içinde blog sayfası içeriğini düzenleme sürecini başlatmaya hazırsınız. Başlamak için şablonun gövde alanındaki düzenle simgesini tıklayın.

Divi'de blog sayfası içeriği düzenleme

Artık düzeni değiştirmek için düzen düzenleyiciyi kullanabilirsiniz.

Divi'de blog sayfası içeriği düzenleme

Divi'de Blog Sayfası Şablonu Düzenlemek için 5 İpucu

Bu şablonda, mevcut sayfa için gönderileri (masaüstünde üç sütun halinde) görüntüleyen bir sütun satırında bulunan bir blog modülümüz var. Bu, blog ve arşiv sayfası şablonları için standart bir kurulumdur. Ancak, gönderileri görüntülemek için bu standart düzeni korumamız gerekmiyor. Divi'de blog sayfası içeriğini düzenlemek için birkaç yararlı ipucu.

#1 İki Sütun Düzeni Oluşturun

Blog modülü (grid düzenine ayarlanmışsa), modül tek sütunlu bir satıra eklenirse (tıpkı şablonumuzda olduğu gibi) gönderileri üç sütunlu bir yapıda görüntüler.

Divi'de blog sayfası içeriği düzenleme

Gönderileri iki sütunlu bir düzende görüntülemek için düzeni değiştirmek istiyorsanız, yapabileceğiniz bir şey var.

İlk olarak, satırın sütun düzenini üçte iki üçte bir düzene değiştirin. Bu, blog gönderilerini satırın sol sütununda iki sütun halinde görüntüler.

Divi'de blog sayfası içeriği düzenleme

Ardından, sütun 1 (blog modülünü içeren) için ayarları açın ve Ana Öğeye aşağıdaki özel CSS'yi ekleyin:

width: 100% !important;

Divi'de blog sayfası içeriği düzenleme

Bu, sütunun satırın tüm genişliğine yayılmasına neden olur.

Şimdi tek yapmamız gereken sağdaki sütunu gizlemek. 2. sütunun (boş olan) ayarlarını açın ve sütunun tüm cihazlarda görünürlüğünü devre dışı bırakın.

Divi'de blog sayfası içeriği düzenleme

Artık isterseniz blog sayfası içeriğini masaüstünde üç yerine iki sütunla düzenleyebilirsiniz.

Divi'de blog sayfası içeriği düzenleme

#2 Yapışkan Mesajları Kullanın

WordPress'e aşina iseniz, bunu zaten biliyor olabilirsiniz. Divi'de (veya WordPress'te) oluşturulan her gönderi yapışkan hale getirilebilir. Bir gönderiyi yapışkan yaptığınızda, gönderi, en son yayınlanan gönderiden önce bile, blog sayfasındaki blog beslemesinin en önünde otomatik olarak görüntülenir. Bu, hedef kitlenizin görmek isteyeceğini (veya ihtiyaç duyacağını) bildiğiniz gönderileri öne çıkarmanın harika bir yoludur.

Bir gönderiyi yapışkan hale getirmek için Divi'de bir gönderiyi düzenleyin ve sağ kenar çubuğundaki "Blogun en üstüne yapıştır" seçeneğini işaretleyin.

Divi'de blog sayfası içeriği düzenleme

Arka uçtaki tüm gönderileri görüntülerken, yaptığınız her gönderi "Yapışkan" olarak etiketlenir.

Divi'de blog sayfası içeriği düzenleme

Artık blog sayfasını ziyaret ettiğinizde, yapışkan yazıların blog yazısı akışının önüne atladığını görebilirsiniz.

Divi'de blog sayfası içeriği düzenleme

Not: Blog Modülünde posta ofsetlerini kullanırken yapışkan gönderiler beklendiği gibi çalışmayabilir. Örneğin, blog modülünü 3 gönderi ofseti ile 3 gönderi gösterecek şekilde ayarlarsanız, yapışkan gönderileriniz 3 gönderiden önce (ve buna ek olarak) görüntülenmeye devam edecektir.

Bir sonraki ipucuna geçmeden önce, yapışkan yazılardan kurtulmanızı öneririm.

#3 Blog Sayfası İçeriğini Ayrı Bölümlerde Düzenlemek için Post Ofsetlerini Kullanın

Her blog modülünün, bir Posta Mahsup Numarası girme seçeneği vardır. Bu, blog modülüne, blog beslemesini görüntülemeden önce belirli sayıda son blog gönderisini atlamasını söyler. Bu seçenek, gönderilerinizi görüntülemek için birden çok blog modülü kullanarak blog sayfanızın düzenini biraz karıştırmak istediğinizde kullanışlı olur. Bu, her blog modülünü farklı şekilde tasarlayabileceğiniz için mizanpaj tasarımında size daha fazla esneklik sağlar.

Post Ofset kullanarak Ayrı Blog Modülü ile En Son Gönderileri İçerme

Blog sayfası içeriğini şablon düzeninizde düzenlemenin bir yolu, sayfanın en üstüne öne çıkan bir blog yazısı bölümü eklemektir. Bu, en yeni üç gönderiyi benzersiz bir şekilde vurgulamanın bir yoludur. İşte şimdi yapmak için.

Düzene yeni bir normal bölüm ekleyin.

Divi'de blog sayfası içeriği düzenleme

Ardından tek sütunlu bir satır ekleyin.

Divi'de blog sayfası içeriği düzenleme

Şablonla birlikte gelen blog modülünü kopyalayın ve yeni satıra yapıştırın.

Divi'de blog sayfası içeriği düzenleme

Blog ayarlarını aşağıdaki gibi güncelleyin:

  • Mesaj Sayısı: 3
  • Devamını Oku Düğmesini Göster: HAYIR
  • Kategorileri Göster: HAYIR
  • Yorum Sayısını Göster: HAYIR
  • Alıntıyı Göster: HAYIR
  • Sayfalandırmayı Göster: HAYIR

Divi'de blog sayfası içeriği düzenleme

En son üç gönderiyi sayfanın üst bölümünde görüntüleyeceğiz.

Şimdi orijinal blog modülüne bir post ofset numarası eklememiz gerekiyor, böylece yukarıda zaten görüntülenen ilk üç gönderiyi atlayacak.

Orijinal blog modülü için blog ayarlarını açın ve aşağıdakileri güncelleyin:

  • Post Ofset Sayısı: 3

Şimdi blog beslemesi 4 numaralı gönderiyle başlayacak.

Divi'de blog sayfası içeriği düzenleme

Sayfanın üst kısmındaki öne çıkan bölümü öne çıkarmak için bir arka plan gradyanı ekleyebilirsiniz.

İşte bunun nasıl görüneceğine dair bir örnek.

Divi'de blog sayfası içeriği düzenleme

Ana Blog Beslemesinin Üstüne Tam Genişlikte Bir Gönderi Kaydırıcısı Ekleme

Yukarıdaki öne çıkan bölüme çok benzer şekilde, blog sayfasının en üstüne tam genişlikte bir gönderi kaydırıcısı ekleyerek blog gönderisi içeriğini de düzenleyebiliriz. Bu, blog sayfaları için popüler bir tasarımdır ve post ofseti olan bir blog modülü ile birlikte kullanabilirsiniz.

İşte nasıl yapılacağı.

İlk olarak, yerleşime tam genişlikte bir bölüm ekleyin.

Divi'de blog sayfası içeriği düzenleme

Ardından bölüme tam genişlikte bir gönderi kaydırıcı modülü ekleyin.

Divi'de blog sayfası içeriği düzenleme

Ardından aşağıdaki ayarları güncelleyin:

  • Mevcut Sayfa için Gönderiler: EVET
  • Mesaj Sayısı: 3

Divi'de blog sayfası içeriği düzenleme

Ardından, gönderi kaydırıcısının tasarımını düzene uyacak şekilde aşağıdaki gibi güncelleyin:

  • Başlık Yazı Tipi: Lato
  • Başlık Yazı Tipi Ağırlığı: Kalın
  • Başlık Metin Boyutu: 40px
  • Gövde Metin Boyutu: 16px
  • Düğme Metin Boyutu: 14px
  • Düğme Metin Rengi: #ff0071
  • Düğme Arka Plan Rengi: #ffffff
  • Düğme Kenar Genişliği: 0px
  • Düğme Yazı Tipi: Lato
  • Düğme Yazı Ağırlığı: Kalın
  • Düğme Yazı Tipi Stili: TT

Divi'de blog sayfası içeriği düzenleme

Blog modülünün ana beslemeyi gösterdiğinden emin olun, gönderi kaydırıcısının 3 gönderisine uyum sağlamak için hala 3'e ayarlanmış bir gönderi ofset numarasına sahip.

Ardından sonucu kontrol edin.

Divi'de blog sayfası içeriği düzenleme

Şimdiye kadar iyi görünüyorsun.

Şimdi bu sonraki ipucuyla ayrı bir blog modülü kullanma fikrini bir adım daha ileri götürelim.

#4 Her Biri Tek Bir Gönderiyle Birden Fazla Blog Modülü Ekleme

Bir şablon düzenine fazladan bir blog modülü eklemeyi bırakmamız gerekmiyor. Aslında, ihtiyacımız olduğu kadar çok blog modülü kullanabiliriz. Tek bir blog posta kartına benzersiz bir tasarım vermek için blog modülü başına yalnızca bir gönderi görüntülemeyi bile seçebiliriz. Ardından, gönderi ofsetlerini kullanarak, blog gönderilerini dinamik olarak görüntülemek için tamamen benzersiz bir düzen oluşturabiliriz.

İşte nasıl yapılacağı.

İlk olarak, ana blog modülünü içeren satırın üzerine yeni bir buçuk sütun satırı ekleyin.

Divi'de blog sayfası içeriği düzenleme

Aşağıdaki orijinal blog modülünü kopyalayın ve yeni satırın sol sütununa yapıştırın. Ardından aşağıdakileri güncelleyin:

  • Mesaj Sayısı: 1
  • Post Ofset Sayısı: 0
  • Sayfalandırmayı Göster: HAYIR

Divi'de blog sayfası içeriği düzenleme

Ardından, az önce oluşturduğunuz blog modülünü kopyalayın ve bir kopyasını sağ sütuna yapıştırın.

Ardından aşağıdakileri güncelleyin:

  • Post Ofset Sayısı: 1
  • Öne Çıkan Resmi Göster: HAYIR
  • Yorum Sayısını Göster: HAYIR
  • Alıntıyı Göster: HAYIR

Divi'de blog sayfası içeriği düzenleme

Sol sütundaki ilkini atlamak için post ofset numarasını 1 olarak ayarladığınızdan emin olun.

Şimdi başka bir blog modülü oluşturarak ve post ofset sayısını her seferinde 1 artırarak bu işleme devam edin.

Sağ sütundaki blog modülünü çoğaltın.

Divi'de blog sayfası içeriği düzenleme

Ardından posta ofset numarasını 2 olarak değiştirin.

Divi'de blog sayfası içeriği düzenleme

Blog modülünü bir kez daha çoğaltın ve posta ofset numarasını 3 olarak değiştirin.

Divi'de blog sayfası içeriği düzenleme

Artık blog modüllerinin her birinin tasarımını ayrı ayrı özelleştirme özgürlüğüne sahip olabilirsiniz. Örneğin, her birine farklı bir arka plan rengi ekleyebilirsiniz.

İşte sonuç.

Divi'de blog sayfası içeriği düzenleme

Ana blog beslemesini aşağıda tutacaksanız, yukarıdaki satırdaki 4 gönderiyi barındırmak için gönderi ofset numarasını 4 olarak güncellediğinizden emin olun.

Divi'de blog sayfası içeriği düzenleme

Aynı tekniğin bazı Tema Oluşturucu Kategori Sayfası Şablonlarımızda kullanıldığını da görebilirsiniz. Aynı konsepti kullanarak bir kategori sayfası şablonunun nasıl oluşturulacağına ilişkin eğiticimize göz atın.

#5 Blog Sayfasında Kategoriye Göre Son Gönderileri Görüntüle

Blog sayfası şablonundaki ana blog beslemesine ek olarak, son gönderilerinizi kategoriye göre de görüntüleyebilirsiniz. Bu, düzeni biraz parçalayarak ve aynı anda farklı kategorileri vurgulayarak blog sayfası içeriğini düzenlemenin harika bir yoludur.

İşte nasıl yapılacağı.

İlk olarak, ana blog modülünü içeren satırın altına yeni bir tek sütunlu satır ekleyin.

Divi'de blog sayfası içeriği düzenleme

Ardından blog ayarlarını aşağıdaki gibi güncelleyin:

  • Mevcut Sayfa için Gönderiler: HAYIR
  • Yazı Tipi: Yazılar
  • Mesaj Sayısı: 3
  • Dahil Edilen Kategoriler: İşletme (veya kendinizden biri)

Divi'de blog sayfası içeriği düzenleme

Bu, İşletme kategorisinden en son üç gönderiyi görüntüler.

Ardından, ilgili kategori başlığına sahip blog modülünün üzerine bir metin modülü ekleyin.

Divi'de blog sayfası içeriği düzenleme

Ve tıpkı bunun gibi, blog sayfanızda öne çıkan bir kategori bölümünüz var - blog sayfası içeriğini düzenlemenin harika bir yolu!

Her biri benzersiz bir tasarıma sahip birden fazla öne çıkan kategori bölümü bile ekleyebilirsiniz.

Divi'de blog sayfası içeriği düzenleme

Bu öne çıkan kategori bölümleri, blog sayfası şablonunun alt kısmına çok uygundur.

Divi'de blog sayfası içeriği düzenleme

Son düşünceler

Bu ipuçları, blog sayfası içeriğini her türlü benzersiz yolla düzenlemenize yardımcı olmalıdır. Ve aynı ipuçları, içeriği görüntülemek için blog modülünü kullanan birçok başka şablon türü (kategori/arşiv sayfası şablonları gibi) için de işe yarar. Bu ipuçlarını keşfetmekten ve bir sonraki projenizde kullanmaktan çekinmeyin.

Yorumlarda sizden haber bekliyorum.

Şerefe!