Divi'den Kenar Çubukları Nasıl Kaldırılır

Yayınlanan: 2021-08-04

Kenar çubuğunu Divi'nin varsayılan sayfa şablonundan kaldırmak, Divi Builder'ı kullanırken kolayca yapılabilir. Ancak Divi'nin varsayılan sayfa şablonları (kenar çubuklu) hala 404'ler ve arşivler gibi sayfalarda gösterildiğinden, kenar çubuğunu şablonunuzdan tamamen çıkarmak isteyebilirsiniz.

Divi'nin varsayılan sağ kenar çubuğu düzenini geçersiz kılmanın en belirgin yolu, sayfayı veya gönderiyi tasarlamak için Divi Builder'ı kullanmaktır. Ancak, bir sayfa veya gönderi için Divi Builder'ı kullanmayacaksanız, kenar çubuğunu kaldırmanın iki ana yolu vardır. Birincisi, tek bir sayfayı veya gönderiyi düzenlerken sayfa düzenini sayfa bazında değiştirmektir. İkincisi, Divi Tema Oluşturucu'da özel bir şablon oluşturarak varsayılan sayfayı veya gönderi şablonunu geçersiz kılmaktır.

Bugün size Divi'nin varsayılan şablonundaki kenar çubuklarını kaldırmanın ve şablonları Divi Builder ile geçersiz kılmanın farklı yollarını göstereceğim. Umarım bu, sizi tutarlı bir şekilde tasarlanmış tam genişlikte bir web sitesi oluşturmak için ihtiyaç duyduğunuz araçlarla donatacaktır.

Başlayalım!

Divi Sayfa Ayarlarını Kullanarak Sayfalardaki Kenar Çubuğunu Kaldırma

Bireysel Gönderiler veya Sayfalar için Varsayılan Sağ Kenar Çubuğu Düzenini Değiştirme

Divi Builder'ı kullanmayan sayfa veya gönderiler için varsayılan sayfa düzeni, aşağıdakine benzer bir sağ kenar çubuğu içerir:

Eğer o sayfa veya yazı için Divi Builder kullanmak istiyorum ve sadece bir sayfa başına bazında kenar çubuğunu kaldırmak istemiyorsanız, sadece Divi Sayfa Ayarları sayfanızı basıp Tam Kısa düzenlerken kenar çubuğunda kutu (ya da hiç bulmak kenar çubuğu ) sayfa düzeniniz için.

Bu, söz konusu gönderi veya sayfa için kenar çubuğunu kaldıracaktır.

Divi Tema Seçeneklerini Kullanarak WooCommerce Mağaza Sayfası, Kategori Sayfası ve Ürün Sayfalarındaki Kenar Çubuğunu Kaldırma

WooCommerce kuruluysa, WC Mağazası, Kategori ve Ürün sayfalarının sayfa düzenini değiştirmek için Divi Tema Seçenekleri içinde birkaç seçenek bulabilirsiniz.

WC Mağazası ve Kategori sayfalarındaki kenar çubuğunu kaldırmak için Divi > Tema Seçenekleri'ne gidin. Genel sekmesi altında, "WooCommerce için Mağaza Sayfası ve Kategori Sayfası Düzeni" etiketli seçeneği bulun ve düzeni "Kenar Çubuğu Yok" veya "Tam Genişlik" olarak değiştirin.

Ürün sayfalarının kenar çubuğunu kaldırmak için Divi > Tema Seçenekleri'ne gidin. Oluşturucu sekmesini seçin. Yazı Tipi Entegrasyonu altında, açılır menüden "Kenar Çubuğu Yok" Ürün Düzenini seçin.

Tema Oluşturucuyu Kullanarak Özel Şablonlar Oluşturarak Kenar Çubuğunu Kaldırma

Divi sayfa ayarlarıyla her sayfa/yazı için kenar çubuklarını kaldırmak, yeni yazılar ve sayfalar ayrı ayrı oluştururken iyi bir çözümdür. Ancak, özellikle kenar çubuklarını tüm sayfalardan kaldırmaya karar verirseniz, bu oldukça zahmetli olabilir. Ayrıca, varsayılan şablon (kenar çubuklu) 404'ler ve arşivler gibi sayfalarda görünmeye devam eder. Bu nedenle, bir sayfadan veya gönderi şablonundan kenar çubuğunu tamamen çıkarmak isteyebilirsiniz. Bunu yapmak için Divi Tema Oluşturucu'yu kullanarak özel şablonlar oluşturabilirsiniz. Bu, genel olarak hangi sayfaların kenar çubuklarına gizlenmesini istediğinizi tam olarak kontrol etmenizi sağlar.

Divi's Theme Builder, istediğiniz herhangi bir sayfaya veya gönderiye uygulanacak global şablonlar tasarlamak için güçlü bir araçtır. Bir şablon için her yeni gövde düzeni oluşturduğunuzda, bu şablon Divi'nin varsayılan sayfa düzenini (bir kenar çubuğu içerir) geçersiz kılar. Bu nedenle, şablon düzeyinde bir kenar çubuğunu kaldırmak için yapmanız gereken tek şey Divi Tema Oluşturucu'da yeni bir şablon oluşturmak ve bunu istediğiniz sayfalara veya gönderilere atamak.

Divi Builder'ı Kullanarak Tam Genişlikte Blog Gönderisi Şablonu Oluşturma

Blog gönderileri, kenar çubuğu olmayan site çapında bir şablonun gerekli olabileceği yerlere harika bir örnektir. Divi'nin yerleşik dinamik içerik seçenekleri, Divi Builder ve dinamik içerik kullanılarak site genelindeki tüm blog gönderilerine uygulanacak bir blog gönderisi şablonu tasarlamanıza olanak tanır. Tamamlandığında, tek yapmanız gereken gelecekteki tüm gönderiler için asıl gövde içeriğini güncellemektir. Yeni gönderi içeriği, özel şablonun tasarımını devralacak!

İşte bunun nasıl yapılacağına dair hızlı bir örnek:

İlk olarak, yeni bir şablon oluşturun ve şablonu Tüm Gönderiler'e atayın.

Ardından şablona özel bir gövde ekleyin.

Şablon Düzen Düzenleyicisini kullanarak, tüm düzeni Divi'nin yerleşik dinamik içerik modülleri ve seçenekleriyle birlikte Divi Oluşturucu'yu kullanarak tasarlayın.

Örneğin, gönderinin başlığını dinamik olarak görüntülemek için Gönderi Başlığı Modülünü kullanabilirsiniz. Veya gönderi başlığını dinamik içerik olarak bir metin modülünün gövdesine çekip H1 etiketleriyle sarabilirsiniz.

Öne çıkan görseli dinamik içerik olarak çekmek için bir görsel modülü kullanabilirsiniz.

Veya yazar sonrası, yazar sonrası biyografi, yazı kategorileri, yayın sonrası tarih ve yorum sayısı gibi dinamik içerik olarak belirli meta verileri çeken bir dizi tanıtım modülü kullanın.

En önemlisi, şablonunuz için herhangi bir özel gövde düzeni oluştururken İçerik Gönderi modülünü eklemelisiniz. İçerik Gönderi modülü, şablonun Gövde Alanı içinde görüntülenecek sayfa veya gönderi içeriği alanını içerir.

Şablon oluşturulduktan sonra, varsayılan WordPress gönderi düzenleyicisini kullanarak kolayca yeni bir blog gönderisi oluşturabilir ve bu blog gönderisinin Divi Theme Builder'ı kullanarak oluşturduğunuz blog gönderisi şablonunun tasarımını devralmasını sağlayabilirsiniz.

Daha fazla bilgi için Divi's Theme Builder ile bir blog yazısı şablonunun nasıl tasarlanacağına dair yazımıza göz atın.

Divi Builder'ı Kullanarak Tam Genişlikte WooCommerce Ürün Sayfası Şablonu Oluşturma

Ürün sayfaları için varsayılan kenar çubuğunu kaldırmak istiyorsanız, tüm blog gönderileriniz için tam genişlikte güzel bir düzen şablonu da oluşturabilirsiniz. Blog yazısı şablonuyla yaptığımıza benzer şekilde, kenar çubuğu olmadan site çapında özel bir Ürün Sayfası Şablonu oluşturmak için Divi'nin yerleşik WooCommerce (veya Woo) Modüllerini de kullanabilirsiniz.

Bunu yapmak için yeni bir şablon oluşturmanız ve şablonu "Tüm Ürünler"e atamanız yeterlidir.

Ardından şablona özel bir gövde ekleyin ve şablon düzenleyiciyi kullanarak gövde düzenini oluşturmak için tıklayın.

Ardından, Ürün sayfası şablonunu tasarlamak için dinamik Woo Modüllerini eklemek için Divi Builder'ı kullanın.

Artık standart ürün sayfası düzenleyicisini kullanarak arka uçta yeni bir ürün oluşturduğunuzda, ürün otomatik olarak atanan gövde şablonunun tasarımını devralır.

Daha fazla bilgi için, site çapında bir woo ürün sayfası şablonunun nasıl oluşturulacağına ilişkin yayınımıza göz atın.

Divi Builder'ı Kullanarak Tam Genişlikte Arşiv Sayfası Şablonları Oluşturma

Tema Oluşturucu, Arşiv Sayfası şablonlarını kenar çubukları olmadan tasarlamayı da kolaylaştırır. Bir kategori sayfası için şablon oluşturmanın anahtarı, yeni bir şablon oluşturmak ve onu Divi Builder'da bulunan birçok arşiv şablonundan birine atamaktır. Örneğin, site genelindeki tüm arşiv sayfalarına atayabilir veya kategori sayfası şablonuna atayabilirsiniz, böylece yalnızca bir kategori içindeki gönderilerin arşivini görüntüleyen sayfalarda gösterilir.

Bir arşiv şablonu için dinamik içeriğin ilk temel öğesi gönderi/arşiv başlığını içermelidir.

Dinamik içeriğin ikinci temel unsuru, görüntülenecek gönderilerin gerçek arşividir. Bunu yapmak için bir blog modülü ekleyin ve mevcut sayfa için gönderileri görüntüleme seçeneğini seçin.

Tam bir inceleme için, Divi Tema Oluşturucu'yu kullanarak blogunuz için bir kategori sayfası şablonunun nasıl oluşturulacağına ilişkin yazımıza göz atın.

Divi Builder'ı Kullanarak Tam Genişlikli 404 Sayfa Şablonu Oluşturma

Tema Oluşturucu, Divi web siteniz için varsayılan kenar çubuğu olmadan bir 404 Sayfa şablonu tasarlamayı da kolaylaştırır. Bir 404 sayfası mutlaka herhangi bir dinamik içeriğe dayanmaz, bu nedenle Divi Builder'ı kullanarak istediğiniz herhangi bir şeyi tasarlamaktan çekinmeyin.

Tam bir inceleme için Divi Tema Oluşturucu'yu kullanarak 404 sayfalık bir şablonun nasıl oluşturulacağına ilişkin yazımıza göz atın.

Divi Builder'ı Kullanarak Tam Genişlikte Arama Sayfası Şablonu Oluşturma

Tema Oluşturucu, Divi web siteniz için varsayılan kenar çubuğu olmadan bir Arama Sonuçları Sayfası şablonu tasarlamayı da kolaylaştırır. Kategori sayfası şablonları gibi, arama sonuçları için bir şablon oluşturmanın anahtarı, özel bir gövde alanı oluşturmak ve aşağıdakileri eklemektir:

1: Dinamik içerik olarak bir gönderi/arşiv başlığı

2: Mevcut sayfanın gönderilerini görüntülemek için Blog Modülü.

3: Kullanıcıların gerektiğinde aramaya devam etmelerini sağlayan bir Arama Modülü.

Tam bir inceleme için, Divi Tema Oluşturucu'yu kullanarak web siteniz için bir Arama Sonuçları sayfası şablonunun nasıl oluşturulacağına ilişkin yayınımıza göz atın.

Belirli Bir Nedeniniz Olmadıkça Tüm Sayfalar için Tam Genişlikli Gövde Şablonu Oluşturmayın

Tüm sayfalarınız için tam genişlikte gövde düzenine sahip özel bir şablon oluşturmak başlangıçta iyi bir fikir gibi görünebilir. Ancak, beklendiği gibi çalışmayabilir. Örneğin, sayfa için Divi Builder'ı kullanabileceğiniz alanı sınırlayabilir veya Divi Builder'ı kullanmayan sayfalar için çok geniş bir gövde alanı oluşturabilirsiniz. Bu nedenle, yalnızca Divi Builder'ı kullanmayacak olan sayfalar için bir sayfa şablonu oluşturmak daha iyidir.

Daha fazla bilgi için genel gövde şablonu oluşturmaya ilişkin belgelere bakın.

Özel CSS ile Varsayılan Kenar Çubuğunu Çıkarma

Divi'nin varsayılan tema sayfası düzenlerini Divi Builder kullanmadan kullanıyorsanız veya tek tek sayfa ayarları veya tema oluşturucu şablonları kullanarak geçersiz kılmak zorunda kalmadan site genelinde kenar çubuğundan kurtulmak istiyorsanız, eski moda CSS kullanabilirsiniz. .

Divi > Tema Seçenekleri'ne gidin. Genel Sekmesi altında, aşağıdaki kodu sayfanın altındaki Özel CSS kutusuna yapıştırın:

/*** Take out the divider line between content and sidebar ***/
#main-content .container:before {background: none;}
 
/*** Hide Sidebar ***/
#sidebar {display:none;}
 
/*** Expand the content area to fullwidth ***/
@media (min-width: 981px){
#left-area {
    width: 100%;
    padding: 23px 0px 0px !important;
    float: none !important;
}
}

Son düşünceler

Bir web sitesi oluştururken, tüm sayfalarınızın aynı tutarlı düzeni ve tasarımı tutması önemlidir. Bu nedenle, Divi Builder'ı kullanarak tam genişlikte bir düzende bir site oluşturuyorsanız, varsayılan olarak tüm sayfalarınız için bu düzeni korumak isteyebilirsiniz. Bu, kullanıcı deneyimini iyileştirebilir. Herhangi bir şey varsa, artık kenar çubuğu ekranlarınızı uygun gördüğünüz şekilde özelleştirme gücüne sahipsiniz.

Umarım bunu siteniz ve gelecekteki projeleriniz için faydalı bulursunuz.

Yorumlarda sizden haber bekliyorum.

Şerefe!