Divi 2.4'ü Keşfetmek: Global Yazı Başlığı Modülünü Kullanarak Benzersiz ve Birleştirilmiş Bir Blog Tasarımı Oluşturma

Geçen hafta, Divi tarihindeki en büyük yükseltme ve en popüler WordPress temamız için dev bir adım olan Divi 2.4'ü tanıttık. Bu güncellemede keşfedilecek o kadar çok harika özellik var ki, hepsini sürüm gönderisinde açıklamak zordu, bu yüzden size nasıl alınacağını öğretmeyi amaçlayan 2 haftalık bir dizi bilgilendirici blog gönderisi yapmaya karar verdik. Divi 2.4'ün tam avantajı ve yeni seçenekleri. Bu serinin dokuzuncu bölümünde, Divi'nin yeni Global Modüllerini kullanmanın heyecan verici bir yolunu keşfediyoruz.

Divi 2.4 Hakkında Her Şeyi Buradan Öğrenin

Benzersiz Bir Tarz Yaratmak ve Onu Küresel Hale Getirmek

Bugün size blogunuz için nasıl benzersiz bir görünüm oluşturacağınızı ve Global Modülleri kullanarak bu görünümü nasıl birleştireceğinizi göstereceğim. Bu kombinasyon neden bu kadar önemli? Çünkü Global Gönderi Başlığı Modülünü kullanarak yeni blog görünümünüzü oluşturduktan sonra, stil her bir gönderiyi düzenlemek zorunda kalmadan tüm blogunuz boyunca değiştirilebilir! Bu yapbozun 3 önemli parçası var:

• Gönderi başlığı, yazar, tarih ve öne çıkan resim gibi gönderi meta bilgilerini otomatik olarak çekmenize ve bu öğeleri benzersiz bir şekilde görüntülemenize olanak tanıyan yeni Gönderi Başlığı Modülü.
• Divi'nin gönderilerde Divi Builder'ı kullanmanıza ve ayrıca gönderinin kenar çubuğunu ve varsayılan gönderi başlığını kaldırmanıza olanak tanıyan yeni gönderi düzeyi özellikleri.
• Divi Kitaplığı ve Divi'nin tek bir modülü, satırı veya bölümü sitenizdeki birden çok gönderi veya sayfada eşitlemenize olanak tanıyan yeni Global Kitaplık Öğeleri.

Birinci Adım: Yeni Blog Yazısı Tasarımınızı Oluşturma

Başlangıç ​​olarak, blog yazısı düzenimizi standart Divi blogundan tamamen farklı olacak şekilde özelleştireceğiz. Varsayılan olarak, Divi'deki blog gönderileri klasik bir tarz alır. Sağda bir kenar çubuğu, solda blog yazısı içeriği ve üstte bir yazı başlığı / öne çıkan var. Hepimizin bildiği ve sevdiği bir format ama aynı zamanda internetteki diğer tüm bloglara benzeyen bir format . Öyleyse neden işleri biraz karıştırmaya çalışmıyorsunuz? Divi bunu mümkün kılıyor.

İlk önce, kenar çubuğunu tam genişlikte bir düzen lehine kaldırarak genel yapımızı biraz değiştirelim. Bu artık Divi Gönderi Ayarları kutusundaki Sayfa Düzeni ayarı kullanılarak gerçekleştirilebilir. Bu kutuyu, gönderinizi yazarken, gönderi düzenleyicisinin altında sol tarafta bulacaksınız.

“Fullwidth” düzenini seçip kaydettiğimizde, kenar çubuğunun gönderiden tamamen kaldırıldığını göreceksiniz. Bu bize çalışmak için daha fazla alan sağlar. Gönderimizi oluşturmak için Divi Builder'ı kullanacağımızdan, bu tam genişlik düzeni bize Medium.com'a benzer bir tarzda ilgi çekici gönderiler oluşturmak için Tam Genişlik Bölümleri ve Tam Genişlik Modüllerinden yararlanma seçeneği sunacaktır.

Özellikle, blog yazımıza daha benzersiz ve çekici bir başlık vermek için Divi'nin yeni Tam Genişlikli Yazı Başlığı modülünü kullanacağız. Ancak bunu yapmadan önce, her blog gönderisinin başına otomatik olarak eklenen varsayılan başlık görüntüsünü kaldırmamız gerekiyor. Bu, daha önce bahsedilen Divi Posta Ayarları kutusundan da yapılabilir.

Ayarlar kutusundaki Gönderi Başlığı seçeneği için “Gizle”yi seçtikten sonra, genellikle gönderinin en üstüne eklenen başlığın, meta verilerin ve öne çıkan görselin kaldırıldığını fark edeceksiniz.

Varsayılan gönderi başlığı kaldırıldığına göre, Tam Genişlik Gönderi Başlığı Modülünü kullanarak kendi özelleştirilmiş versiyonumuzu ekleyebiliriz. Başlamak için, gönderi düzenleyicinin üzerindeki mor renkli "Divi Builder'ı Kullan" düğmesini tıklayarak gönderinizi oluşturmak için Divi Builder'ı kullandığınızdan emin olun. Bu, oluşturucuyu etkinleştirecek ve oluşturucu öğelerini kullanarak gönderinizi yukarıdan aşağıya oluşturmanıza izin verecektir.

Yeni özelleştirilmiş başlığımızı eklemek için gönderinizin en üstüne yeni bir Tam Genişlik Bölümü ekleyin ve ardından bölümün içine bir Tam Genişlikli Gönderi Başlığı Modülü ekleyin.

Bu, özel gönderi başlığınızın görüntüsünü ayarlayabileceğiniz gönderi başlığı modülü için ayarlar kutusunu başlatır. Burada aşağıdakiler dahil birçok seçenek vardır:

Başlığı Göster – Her gönderi başlığı modülünün içinde, hangi bilgi parçalarını görüntülemek istediğinizi seçebilirsiniz. Başlığı tamamen devre dışı bırakmak ve yalnızca öne çıkan görselinizi ve meta verilerinizi görüntülemek istiyorsanız, bu seçenek devre dışı bırakılabilir.

Meta Göster – Ayrıca, genellikle yazı başlığının altına eklenen, yazı yazarı, tarih ve kategoriler gibi tüm meta bilgilerini gizlemeyi de seçebilirsiniz. Bu seçeneği devre dışı bırakmak, tüm bilgileri bir kerede gizleyecektir. Aşağıdaki ayarları kullanarak tek tek meta bilgi parçalarını da devre dışı bırakabilirsiniz.

Yazarı Göster – Bu, meta sonrası kutusundaki yazar adını devre dışı bırakır veya etkinleştirir.

Tarihi Göster – Bu, gönderi meta kutusundaki gönderi tarihini devre dışı bırakır veya etkinleştirir.

Tarih Formatı – Burada tarih görüntülemeniz için kullanılan formatı ayarlayabilirsiniz. Örneğin, 23/12/2015 tarihinden 23 Ocak 2015 tarihine vb. geçiş yapabilirsiniz.

Kategorileri Göster – Bu, meta sonrası kutusundaki kategorileri devre dışı bırakır veya etkinleştirir.

Yorum Sayısını Göster – Bu, meta sonrası kutusundaki yorum sayısını devre dışı bırakır veya etkinleştirir.

Öne Çıkan Görseli Göster – Öne çıkan görselin görüntülenmesi isteğe bağlıdır. Gönderi için öne çıkan resmi gizlemek isterseniz, buradan devre dışı bırakılabilir.

Öne Çıkan Görüntü Yerleştirme – Öne çıkan görüntü etkinse, çeşitli görüntüleme yöntemlerinden birini seçebilirsiniz. Resmi başlığın üstüne, başlığın altına yerleştirebilir veya hatta yazı başlığının arkasında arka plan resmi olarak kullanabilirsiniz.

Paralaks Etkisi – Öne çıkan görüntü arka plan görüntüsü olarak kullanılıyorsa, paralaks modunu etkinleştirebilirsiniz.

Metin Yönü – Gönderi başlığınızda hangi metin öğelerinin görüneceğini kontrol etmenin yanı sıra, sol, sağ veya ortalanmış metin arasından seçim yaparak bunların yönünü de ayarlayabilirsiniz.

Metin Arka Plan Rengi – Metninize bir arka plan rengi uygulamak, başlığınızın etrafına renkli bir kutu yerleştirecektir.

Metin Rengi – Yazı başlığınız için açık ve koyu metin arasında seçim yapabilirsiniz. Koyu bir metin arka plan rengi uyguladıysanız, okunabilir olduğundan emin olmak için yazı başlığı metninizi açık hale getirmeyi düşünün.

Bu çeşitli ayarları kullanarak blogunuz için çeşitli stiller oluşturabilirsiniz. Bu eğitime örnek olarak aşağıdaki ekran görüntüsünde gösterilen ayarları kullanacağım. En önemlisi, öne çıkan görseli yazı başlığının “üstüne” yerleştirmeyi seçtim. Ayrıca bir “metin arka plan rengi” ekledim ve Gelişmiş Tasarım Ayarlarında yazı başlığı yazı tipini, stilini ve boyutunu ayarladım.

Sonuç, varsayılan Divi gönderi düzeniyle karşılaştırıldığında tamamen farklı görünen bir gönderidir! Artık blogumuz için netteki diğer Divi bloglarından ve WordPress bloglarından farklı benzersiz bir stil oluşturduk! Posta Başlığı modülündeki çeşitli ayarlarla denemeler yapmak çok sayıda sonuç verebilir.

Bu yeni başlık stili, Tam Genişlikli Görüntü Modülleri ile birleştirildiğinde özellikle harika görünüyor. Gönderimizi oluşturmak için Divi Builder'ı kullandığımızdan, yararlanabileceğimiz birçok yeni düzen seçeneği var.

İkinci Adım: Global Modülleri Kullanarak Yeni Düzeninizi Eşitleyin

Blog yazımız için benzersiz bir görünüm yarattığımıza göre, bir sonraki adım tüm blogumuzu aynı stil altında birleştirmek ve bu stili yönetmeyi kolaylaştırmaktır. Peki burada çözdüğümüz asıl sorun nedir? Her yeni blog yazısı yazdığınızda tamamen aynı ayarlarla yeni bir yazı başlığı modülü oluşturmak zaman alır. Ayrıca, 1.000 blog gönderisi oluşturmuş ve yeni gönderi başlığı modülünüzü her birinin başında kullanmışsanız, bir gün düzeni değiştirmek isterseniz ne olur? Her birinin içindeki gönderi başlığı modülünü ayarlamak için 1000 blog gönderisinin tümünü gözden geçirmek zorunda kalacaksınız! Bu kulağa pek eğlenceli gelmiyor. Neyse ki, özel yazı başlığı modülümüzü Divi Kitaplığına Global Modül olarak kaydederek bu zahmetten kaçınabiliriz. Global Modül ile ilgili her şeyi ele almayacağım, çünkü bu zaten bir önceki yazımızda ele alındı. Biraz daha derine inmek istiyorsanız bunu kontrol ettiğinizden emin olun.

Bu yazı başlığını Divi Kitaplığına kaydetmek için modülü veya modülün üst bölümünü düzenlerken “Kaydet ve Kitaplığa Ekle” düğmesine tıklayın. Bu durumda, Tam Genişlik Bölümünün tamamını Divi Kitaplığına kaydettim. Kaydetme işlemi sırasında “bunu global bir öğe yap” seçeneğini göreceksiniz.

Öğe global olarak kaydedildiğinde, oluşturucu içinde yeşile döndüğünü fark edeceksiniz. Küresel öğeler, oluşturucu içinde yeşil renkleriyle kolayca tanımlanabilir.

Bir sonraki adım, oluşturduğunuz her yeni gönderinin başına bu aynı genel bölümü eklemektir! Gönderi başlığı, mevcut gönderideki bilgileri otomatik olarak aldığından, yeni bir sayfaya eklerken modülü düzenlemeye gerek yoktur. Gönderi başlığınız, meta verileriniz ve öne çıkan görseliniz modül tarafından ek talimat olmadan yakalanır. Modül yalnızca, global modülün her bir eşgörünümü tarafından paylaşılacak olan bu öğelerin organizasyonunu kontrol eder.

Ne zaman yeni bir blog yazısı yazsanız, yeni bir bölüm eklerken “Kitaplıktan Ekle” bağlantısını tıklayın ve yeni kaydettiğiniz genel yazı başlığınızı bulun.

Bu gönderi başlığı, blog gönderilerinizin her birine eklendiğinde, hepsi aynı başlık biçimini paylaşacak! Modül, eklendiği belirli gönderi için gönderi bilgilerini otomatik olarak aldığından, genel modülü gönderiye eklemek dışında herhangi bir şey yapmanıza gerek yoktur.

Şimdi Divi Builder'ı kullanarak tüm blogumuzun tüm görünümünü ve hissini birleştirdik! Daha da önemlisi, eğer tüm blog gönderilerimizin görünümünü değiştirmek istersek, global gönderi başlığı modülünü yalnızca bir kez düzenlememiz yeterli! Bu aynı mod her sayfaya eklendiğinden, modülü tek bir yerde düzenlediğinizde, değişiklik global modülün tüm örneklerine aktarılacaktır.

Sadece birkaç tıklamayla blogumuzun tasarımını ayarlayabiliriz. Örneğin, burada yazı başlığı arka plan rengini kırmızı olarak değiştirdim ve öne çıkan görüntünün konumunu arka plan görüntüsü olarak kullanılacak şekilde (yazı başlığının altına yerleştirmek yerine) ayarladım.

Sadece birkaç saniye içinde tüm blog stilimiz değişti!

Yönetmesi Kolay Yepyeni Bir Blog

Buradaki amacım, sadece Divi Builder'ı kullanarak benzersiz görünümlü bir blogun nasıl oluşturulacağını göstermek değil, aynı zamanda bunu yönetmeyi kolaylaştıracak şekilde nasıl yapılacağını göstermekti. Bu, Divi'nin yeni Global Kütüphane Öğelerinin ne kadar güçlü olabileceğinin mükemmel bir örneğidir (özellikle içeriklerini dinamik olarak alan modüller için kullanıldığında). Umarım blog yazılarınızda Divi Builder'ı kullanmaktan keyif alırsınız ve oluşturduğunuz tüm güzel gönderileri görmek için sabırsızlanıyorum!