de-Novembre

Cara Membuat Block Pada HTML Menjadi Widget WordPress

Posted on: January 21, 2010

Ada begitu banyak blocks yang terbentuk dari perpaduan antara HTML dan CSS pada wordpress. Mungkin Anda berniat untuk menempatkan salah satu component widgets pada salah satu blocks yang terdapat pada layout wordpress tersebut.

WordPress, menawarkan banyak themes yang bisa Anda download dan install secara gratis dan mudah. Penempatan widgets-widgets ini sangat bergantung pada klasifikasi themes yang Anda pilih. Ini akan mempengaruhi pada sistem penama’an dan penempatan serta pengaturan block-block widget pada template Anda.

Untuk melakukan hal itu Anda perlu mengetahui terlebih dahulu tentang :

  1. Menginstalasi themes secara manual atau copy/paste
  2. Penempatan file-file themes yang Anda pilih
  3. Cara kerja widgets pada wordpress

Langkah-langkah :

  1. Pada folder themes yang Anda pilih pada umumnya terdapat satu file bernama functions.php
  2. Pada file ini terdapat baris script sebagai berikut :
     if ( function_exists('register_sidebar') )
  3. Dibawahnya terdapat baris-baris script seperti berikut :
                     register_sidebar(array(
                 	     'name'=>'top_right',
                         'before_widget' => '<li id="%1$s" class="topright %2$s"><div class="sidebarbox">',
                         'after_widget' => '</div></li>',
                         'before_title' => '<p class="fleft">',
                         'after_title' => '</p>',
                     ));
                 
  4. Ubahlah ‘name’ diatas sesuai dengan kebutuhan dan penama’an yang tepat menurut Anda, apabila Anda menyamakan penama’an pada ‘name’ ini dengan penamaan pada block html pada attribute ‘id’ pada file html Anda, maka dengan ini akan mempermudah dalam koneksi fungsi ini selanjutnya.
  5. Sampai kepada langkah ini Anda sudah bisa sidebar baru pada widgets Anda di back-end / admin panel wordpress Anda
  6. Selanjutnya Anda bisa menambahkan baris script berikut pada html file themes Anda :
                      <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('top_right') ) : ?>
                      <?php endif; ?>
                 
  7. Perhatikan penama’an top_right pada script diatas, ini merujuk pada penama’an di point nomor 3

Apabila Anda ingin memasang blocks-blocks yang dijadikan widgets pada wordpress tanpa mengubah atau membuat blocks menjadi accessible pada widgets Anda dapat kunjungi file-file berikut :

  1. {wordpress_path}/wp-includes/post-template.php
  2. {wordpress_path}/default-widgets.php

Disini terdapat kumpulan fungsi-fungsi yang ada dalam widgets namun tidak dipanggil secara widgets, dalam artian lain tidak bisa di edit pada back-end wordpress / fixed. Anda cukup mencari dengan nama component yang ada pada widgets dan memasang fungsi tersebut pada halaman wordpress themes yang Anda inginkan.

Tags:

2 Responses to "Cara Membuat Block Pada HTML Menjadi Widget WordPress"

Leave a comment

Categories