WordPress

Eklentisiz WordPress Sidebar Yapımı

WordPress’te Dinamik Sidebar Oluşturma

1.Adım: Aşağıda ki kodu temanızın functions.php dosyasında en son satıra ekleyiniz.

// WordPress Dinamik Sidebar Oluşturma
function bugrayazar_sidebars() {
    register_sidebar(
        array(
            'id' => 'bugrayazar-sidebar',
            'name' => __( 'Dinamik Sidebar', 'bugrayazar' ),
            'description' => __( 'Wordpress teması için dinamik sidebar 'huseyinkorbalta' ),
            'before_widget' => '<div class="widget-class">',
            'after_widget' => '</div>',
            'before_title' => '<div class="title-class">',
            'after_title' => '</div>'
        )
    );
}
add_action( 'widgets_init', 'bugrayazar_sidebars' );

Sidebar Parametreleri

id ↬ Oluşturacağımız dinamik sidebarın benzersiz bir id etiketine ihtiyacı var. Daha önce temanız da kullanılmayan bir id ismi belirtmeniz gerekebilir. Türkçe karakter ve özel karakterler kullanmamaya özen gösterin.

name ↬ Bu satır ise oluşturduğumuz dinamik sidebarın ismidir. İstediğiniz bir ismi verebilirsiniz.

description ↬ Bu satır ise dinamik sidebar için açıklama kısmıdır.

before_widget ↬ Bu satır ise sidebar kısmında oluşturacak olan bileşenlerin CSS classlarını ve HTML elementlerini belirttiğiniz yerdir. Bu kısım sidebar kısmında ki bileşenlerin genel kapsayıcısını belirtir.

after_widget ↬ Bu satır ise ilk başta açmış olduğunuz html elementlerinin kapatıldığı yerdir. Yani, genel kapsayıcı alanın bittiği yerdir.

before_title ↬ Bu satır ise dinamik sidebar içerisinde yer alacak bileşenlerin başlıkları için CSS classlarını ve HTML elementlerini belirttiğiniz yerdir.

after_title ↬ Bu satır ise bir before_title satırında açmış olduğunuz HTML elementlerinin kapatıldığı yerdir.

Gerekli düzenlemeleri ve ilgi satırları kendi tema yapınıza uygun şekilde düzenledikten sonra functions.php dosyasını kaydedin. Daha sonra ikinci adıma geçebilirsiniz.,

2.Adım: Aşağıda ki kodu temanızın sidebar.php dosyasına ekleyiniz.

<?php if ( is_active_sidebar( 'bugrayazar-sidebar' ) ) : ?>
<?php dynamic_sidebar( 'bugrayazar-sidebar' ); ?>
<?php endif; ?>

İlgili Makaleler

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Başa dön tuşu