Tutorial Cara Membuat Sidebar di WordPress | KafeinKode

Kursus bahasa arab berkualitas

Tutorial Cara Membuat Sidebar di WordPress

Anonim 5 Comments



Tak terasa sudah 5 tahapan telah kita lalui dalam membuat template WordPress, artinya kita sudah menyerap setengahnya dari ilmu dan tutorial yang telah kita pelajari sebelumnya. Masih ada beberapa tahapan lagi yang harus kita selesaikan, salah satu di antaranya adalah tentang tutorial cara membuat sidebar di WordPress, dan inilah yang akan kita bahas pada pertemuan kali ini.

Pada banyak kasus pembuatan template, baik itu template blogger, WordPress maupun yang lainnya, sidebar merupakan elemen yang wajib ada dan wajib dibuat. Keberadaannya sering dimanfaatkan untuk menempatkan widget berupa widget popular posts, recent posts, kategori posts, archive dan masih banyak lagi. Sidebar biasanya diletakkan di samping kanan atau di samping kiri, dengan lebar yang lebih kecil. Berikut langkah-langkah yang harus dilakukan dalam membuat sidebar beserta elemen-elemennya.

Step 1: tutorial cara membuat sidebar di WordPress, pertama-tama, bukalah file sidebar.php terlebih dahulu. Kemudian letakkan kode ini:

Tutorial-Cara-Membuat-Sidebar-di-WordPress
<?php if ( is_active_sidebar( 'sidebar-widget-area' ) ) { ?>


<div class="sidebar-wrapper">


<aside class="sidebar-widget">
<?php dynamic_sidebar( 'sidebar-widget-area' ); ?>
</aside>


</div>


<?php } ?>

Jika sebelumnya Anda mengikuti tutorial pembuatan template WordPress dari awal, bukalah file sidebar.php, lalu hapus terlebih dahulu kode di bawah ini, kemudian ganti dengan kode yang di atas tadi, lalu simpan.



<div class="sidebar-wrapper">


ini elemen sidebar wrapper 

</div>


 

Step 2: Langkah kedua tutorial cara membuat sidebar di WordPress adalah membuka file functions.php, lalu cek kode di bawah ini. Apakah sudah ada atau belum? Jika sudah ada, tutup lagi file functions.phpnya, jika belum silahkan tambahkan kode ini di file functions.php, lalu simpan.

function sead_widgets_init() {
// Sidebar widget area, located in the sidebar. Empty by default.
register_sidebar( array(
'name' => __( 'Sidebar Widget Area', 'sead' ),
'id' => 'sidebar-widget-area',
'description' => __( 'The sidebar widget area', 'sead' ),
'before_widget' => '

<div class="widget-container %2$s" id="%1$s">',
'after_widget' => '</div>


',
'before_title' => '

<h3 class="widget-title">',
'after_title' => '</h3>


',
'image_scan' => true,
'width' => '100', 'height' => '100', 'image_class' => 'alignleft'
) );
}
add_action( 'widgets_init', 'sead_widgets_init' );

 

Step 3: Langkah ketiga tutorial cara membuat sidebar di WordPress, Silahkan masuk ke Appearance > Widgets, lalu atur widget mana yang ingin ditaruh di sidebar. Pada gambar di bawah ini, tersedia banyak widget di antaranya adalah widget recent posts, meta, categories, calender, dan masih banyak lagi. Tempatkan dengan cara drag widget yang dipilih lalu letakkan pada sidebar widget area.
side
Silahkan reload halaman webnya untuk melihat hasilnya. Untuk styling? entar aja belakangan!

 

Tahapan lengkap cara membuat template WordPress bisa Anda lihat di http://www.kafeinkode.com/membuat-template-wordpress

Kursus bahasa arab berkualitas

[shareaholic app="recommendations" id="20730868]

5 comments

Leave a Reply

Your email address will not be published. Required fields are marked *

  1. udinpeluruh@gmail.com'

    makasih banyak kak. sangat membantu.

    Reply
  2. muslihmaulana223@gmail.com'

    cara membuat side bar recent dan popular menyampint itu gimana mas ? punya saya menurun kebawah

    Reply
  3. setyo0606@gmail.com'

    Kalau cara untuk memperbaiki widget sidebar HTML khusu gimana, masalahnya kok ga bisa diedit dimasukin kode HTML

    Reply