WordPress'te yazılar ve sayfalar için farklı kenar çubukları nasıl gösterilir?

Varsayılan olarak, WordPress tüm gönderilerde ve sayfalarda aynı kenar çubuğunu gösterir. Ancak bazen, en önemli gönderileriniz için tamamen farklı bir kenar çubuğu veya tüm gönderi kategorisiyle ilgili kenar çubuğu öğeleri görüntülemek isteyebilirsiniz. Bunu nasıl yapacağınızı hiç merak ettiyseniz, şanslısınız!

Bu makalede, hem manuel olarak hem de WordPress eklentileri ile farklı gönderiler veya sayfalar için benzersiz kenar çubuklarının nasıl oluşturulacağını göstereceğim. Ama önce, bunu neden yapmak isteyebileceğiniz hakkında daha fazla konuşalım.

Neden farklı kenar çubukları isteyebilirsiniz?

Daha önce belirtildiği gibi, blogunuzda çok sayıda kategori varsa, o konuyla ilgili benzer teklifler, reklamlar veya ürünler içeren bir kenar çubuğunuz olması cazip gelebilir. Ya da her sayfanın hedef kitlesine göre hazırlanmış bir "Hakkımızda" kenar çubuğunda işletmeniz hakkında konuşmak isteyebilirsiniz.

Bu tür durumlarda, benzersiz bir kenar çubuğuna sahip olmak isteyeceksiniz. Bir tane oluşturmanın iki yolu vardır: kendinizinkini geliştirerek veya bir WordPress eklentisiyle manuel olarak.

Önce manuel yolu kapatalım.

Yeni bir WordPress kenar çubuğu manuel olarak nasıl oluşturulur

El ile yeni bir kenar çubuğu oluşturmak için ideal olarak yerel bir ortamda bir alt tema kullanmalısınız. Ben zaten benimkini yirmiyedi tema için oluşturdum, ancak aynı süreci herhangi bir tema için de takip edebilirsiniz.

İlk önce, kenar çubuğunun temanızda kayıtlı olduğu dosyayı bulun. Genellikle bu function.php dosyasıdır, ancak temanıza bağlı olarak değişebilir.

Dosyayı açın ve kenar çubuğu kodunun işlevini bulun. Genellikle register_sidebar oluşacaktır ve tam fonksiyon şöyle görünebilir:

function twentyseventeen_widgets_init() {

register_sidebar(

array(

'name'       => __( 'Blog Sidebar', 'twentyseventeen' ),

'id'         => 'sidebar-1',

'description'   => __( 'Add widgets here to appear in your sidebar on blog posts and archive pages.', 'twentyseventeen' ),

'before_widget' => '<section id="%1$s" class="widget %2$s">',

'after_widget'  => '</section>',

'before_title'  => '<h2 class="widget-title">',

'after_title'   => '</h2>',

)

);


register_sidebar(

array(

'name'       => __( 'Footer 1', 'twentyseventeen' ),

'id'         => 'sidebar-2',

'description'   => __( 'Add widgets here to appear in your footer.', 'twentyseventeen' ),

'before_widget' => '<section id="%1$s" class="widget %2$s">',

'after_widget'  => '</section>',

'before_title'  => '<h2 class="widget-title">',

'after_title'   => '</h2>',

)

);


register_sidebar(

array(

'name'      => __( 'Footer 2', 'twentyseventeen' ),

'id'         => 'sidebar-3',

'description'   => __( 'Add widgets here to appear in your footer.', 'twentyseventeen' ),

'before_widget' => '<section id="%1$s" class="widget %2$s">',

'after_widget'  => '</section>',

'before_title'  => '<h2 class="widget-title">',

'after_title'   => '</h2>',

)

);

}

add_action( 'widgets_init', 'twentyseventeen_widgets_init' );

Şimdi tüm işlevi kopyalayın ve alt temanızda bir function.php dosyası oluşturun (zaten yoksa) ve kodu yapıştırın. İşlev adını değiştirdiğinizden emin olun.

Kaç tane ek kenar çubuğu oluşturmanız gerektiğine bağlı olarak, aynı kodu kopyalayabilir ve her kenar çubuğuna benzersiz bir kimlik atayabilirsiniz. Her birini benzersiz kılmak için adı ve açıklamayı da değiştirmelisiniz. Burada iki yeni kenar çubuğu oluşturdum:

function twentyseventeen_new_widgets_init() {

register_sidebar(

array(

'name'       => __( 'Wordpress Sidebar', 'twentyseventeen' ),

'id'         => 'sidebar-4',

'description'   => __( 'Add widgets here to appear in your sidebar on wordpress related blog posts.', 'twentyseventeen' ),

'before_widget' => '<section id="%1$s" class="widget %2$s">',

'after_widget'  => '</section>',

'before_title'  => '<h2 class="widget-title">',

'after_title'   => '</h2>',

)

);



register_sidebar(

array(

'name'       => __( 'Web Design Sidebar', 'twentyseventeen' ),

'id'         => 'sidebar-5',

'description'   => __( 'Add widgets here to appear in your sidebar on web design related blog posts.', 'twentyseventeen' ),

'before_widget' => '<section id="%1$s" class="widget %2$s">',

'after_widget'  => '</section>',

'before_title'  => '<h2 class="widget-title">',

'after_title'   => '</h2>',

)

);

}

add_action( 'widgets_init', 'twentyseventeen_new_widgets_init' );

Yeni kenar çubukları artık hazır; Widget'lar bölümünü kontrol ederseniz, iki yeni widget alanı gösterecektir. Her kenar çubuğuna tanınabilir hale getirmek için basit bir metin widget'ı ekledim.

Kenar çubuklarınızı oluşturduktan sonra, konumu atamanın zamanı geldi. Mevcut sağ kenar çubuğunu değiştirmek istiyoruz, bu nedenle dosyayı bulunduğu yeri bulmanız gerekiyor.

Bu örnek için, sidebar.php . Dosyayı ana temadan kopyalayın ve alt temanıza yapıştırın.

Dosyayı kontrol ederseniz, ana sağ kenar çubuğunun kimliği olan sidebar-1 çağırır.

<aside id="secondary" class="widget-area" role="complementary" aria-label="<?php esc_attr_e( 'Blog Sidebar', 'twentyseventeen' ); ?>">

<?php dynamic_sidebar( 'sidebar-1' ); ?>

</aside>

Şimdi, web tasarım kategorim için bir kenar çubuğu ve WordPress kategorim için bir tane daha oluşturacağım. Bu, iki farklı yolla elde edilebilir: biri şablona dayalı bir yaklaşım, diğeri ise kategoriye dayalı bir yaklaşımdır.

Şablon odaklı yaklaşım

Bu yaklaşımda, gereksinimlerinize bağlı olarak farklı şablonlar oluşturmanız gerekir. Bu örnekte, single.php tek gönderilerden sorumludur, böylece dosyayı alt temanıza kopyalayıp yapıştırabilirsiniz. Dosyayı wordpress-post.php gibi buna göre yeniden adlandırın ve bir şablon adı da ekleyin.

/* Template Name: WordPress Sidebar

* Template Post Type: post*/

Aynı şekilde webdesign-post.php adında başka bir şablon oluşturdum.

Şimdi, alt temanın sidebar.php dosyasına geri dönün ve hangi şablonun kullanımda olduğunu kontrol etmek için basit bir koşul ekleyin. Bunun için is_page_template() fonksiyonunu kullanacağız.

Kod kendini açıklayıcıdır. Hangi şablonun kullanımda olduğunu kontrol eder ve kenar çubuğunu buna göre ayarlar. Koşulların hiçbiri yerine getirilmezse, varsayılan kenar çubuğunu kullanır.

<?php

if ( is_page_template('wordpress-post.php') ) {

dynamic_sidebar( 'sidebar-4' );

}elseif ( is_page_template('webdesign-post.php') ){

dynamic_sidebar( 'sidebar-5' );

}else{

dynamic_sidebar( 'sidebar-1' );

}

?>

Şimdi yeni bir gönderi oluşturalım ve az önce oluşturduğumuz şablonlardan birini atayalım.

Bu gönderi için WordPress kenar çubuğunu seçtiğimi göreceksiniz.

Kategori odaklı yaklaşım

Bu örnekte (yan çubuğun gönderi kategorilerine göre değiştirilmesi), kategoriye dayalı bir yaklaşım, şablona dayalı yaklaşımdan daha iyi sonuç verecektir. Bunu yapmak için, in_category() işlevini kullanarak şablon yerine kategoriye göre sidebar.php koşulu ayarlamanız gerekir.

<?php

if ( in_category('wordpress') ) {

dynamic_sidebar( 'sidebar-4' );

}elseif ( in_category('web-design') ){

dynamic_sidebar( 'sidebar-5' );

}else{

dynamic_sidebar( 'sidebar-1' );

}

?>

Şimdi yeni bir gönderi düzenler veya oluşturursanız, istediğiniz kategoriyi eklemeniz yeterlidir. Kenar çubuğunu buna göre görüntüler, böylece herhangi bir şablon seçmenize gerek kalmaz! Burada gönderi kategorim olarak web tasarımını seçtim, böylece web tasarımı kenar çubuğu görünecek.

Temel olarak, sidebar.php koşulunu özel gereksinimlerinize göre ayarlamanız yeterlidir.

WordPress eklentileriyle özel kenar çubukları nasıl oluşturulur

Kenar çubuklarını manuel olarak oluşturmakta sorun yaşıyorsanız, bunları kolayca oluşturmanıza olanak tanıyan bazı kullanışlı WordPress eklentilerini deneyebilirsiniz!

Böyle bir eklenti İçeriğe Duyarlı Kenar Çubukları. Tek tek sayfalarda, gönderilerde, kategorilerde vb. dinamik olarak kenar çubukları oluşturmanıza olanak tanıyan basit bir eklentidir.

Kurulduktan sonra, yönetici panelinde bir Kenar Çubukları menüsü göreceksiniz.

Kenar çubukları > Yeni Ekle

İlk önce, kenar çubuğunuza bir ad ekleyin. Ardından, Kenar Çubuğu Koşulları açılır menüsünden görüntüleme koşullarını ayarlayabilirsiniz. Bir kenar çubuğunun sayfalar, gönderiler, kategoriler, yazar vb. gibi birden çok koşulu olabilir.

Kenar çubuğunuzu zamanlama sekmesinden planlayabilir ve tasarım sekmesinde HTML etiketlerini değiştirebilirsiniz.

Sağ tarafta bir Seçenekler kutusu göreceksiniz. Buradan, yeni kenar çubuğunuzun konumunu ve kurallarını belirleyebilirsiniz. Kenar çubuğunuz için bir kısa kod oluşturmak gibi eylemler de gerçekleştirebilirsiniz.

Kenar çubuğunuz yayınlandıktan sonra Görünüm > Widget'lar bölümünden erişebilirsiniz.

Bu yeni kenar çubuğu, ayarlarınıza göre sayfalarda ve gönderilerde otomatik olarak görünecektir.

Eklenti ayrıca, ilk ayarlarınızdan bağımsız olarak her gönderiyi veya sayfayı düzenlerken kenar çubukları seçmenize olanak tanır.

Bir gönderi veya sayfada, sağ tarafta size mevcut tüm kenar çubuklarını gösterecek bir Kenar Çubukları – Hızlı Seçim paneli göreceksiniz. Buradan, başlangıç ​​ayarlarında önceden ayarlanan hedef konumda kenar çubuğunuzu seçebilirsiniz.

Örneğin, daha önce Kenar çubuğumu oluşturmuştum ve hedef konumum Blog Kenar Çubuğu idi, bu nedenle Hızlı Seçim panelinde Kenar çubuğum yalnızca Blog Kenar Çubuğu için kullanılabilir.

Bununla birlikte, düzenleme sayfası bölümünden yeni kenar çubukları da oluşturabilirsiniz. Yeni kenar çubuğunuzun adını yazmanız ve sayfayı yayınlamanız veya güncellemeniz yeterlidir.

Yeni bir kenar çubuğu oluşturursanız, bunu Görünüm > Pencere Öğeleri bölümünde etkinleştirmeniz yeterlidir.

Not: Sayfalarınıza kenar çubukları da atayabilirsiniz, ancak sayfa şablonunuzun bir kenar çubuğu içerdiğinden emin olun. Bu olmadan, düzenleme sayfası bölümünde ayarlamış olsanız bile kenar çubuğu görüntülenmez.

Çözüm

Flywheel'in Tasarım Stajyeri, Rese ve Sanat Yönetmeni, Andrea

Artık kenar çubukları oluşturmak için iki seçenek gördünüz: manuel geliştirme ve eklentilerle. Kodlar konusunda rahat değilseniz, bir eklenti kullanmak sizin için en iyi seçenek olabilir, ancak belirli bir gereksiniminiz varsa ve sitenize fazladan bir eklenti eklemek istemiyorsanız, manuel yoldan gitmelisiniz. . Önemli olan, gereksinimlerinizi anlamak ve ardından en iyi seçeneğinizi seçmektir!

Başka bir eğitime hazır mısınız? Şunlardan birini deneyin:

• Web sitenize yapışkan bir başa çıkma düğmesi nasıl eklenir
• Özel tek gönderi şablonları nasıl oluşturulur?
• WordPress sitenizi nasıl mobil uyumlu hale getirirsiniz?
• WordPress sitenizi nasıl klonlarsınız?