Tutorial PHP : Cara Membuat Widget Di Wordpress Bag. 1

Sudah menjadi rahasia yang umum tentang banyaknya developer Indonesia yang sukses dalam kacah per-wordpress-an, entah karena fokus di jasa pembuatan website menggunakan wordpress, ataupun membuat produk template premium wordpress, atau juga membuat plugin-plugin di wordpress yang memang dibutuhkan oleh banyak orang. Memanfaatkan psikologi user akan kelengkapan dan kemudahan suatu fitur yang akan dibuat.

Pada tutorial sebelumnya saya telah menyinggung bagaimana membuat plugin di wordpress, silahkan simak selengkapnya di sini http://www.ilmuwebsite.com/membuat-plugin-wordpress-bag-1-intro-to-action-function. Kali ini kita akan membahas bagaimana sih caranya membuat widget di wordpress menggunakan PHP.

Perlu diketahui bahwa untuk membuat widget, Anda betul-betul harus mengerti betul pemrogaman php, jelas akan kode-kode dalam php programming, ditambah dengan konsep OOP menggunakan PHP. Jika belum mengerti maka kecil kemungkinan Anda bisa mempelajari cara membuat widget wordpress. Atau paling tidak Anda cukup mengerti logikanya itu juga jadi keuntungan tersendiri. Karena logika pemrogaman itu bukan hafalan. Oke ya?

Langsung saja kita masuk ke dalam pembuatan widget di wordpress...

Dalam praktik kali ini saya menggunakan wordpress yang sudah diletakkan dalam folder htdocs pada xampp, yakni letaknya di D:\xampp\htdocs\wplabz

Untuk widget bisa diletakkan di folder plugin wordpress. Saya meletakkannya di D:\xampp\htdocs\wplabz\wp-content\plugins

Kita persiapkan sebuah file php kosong beri nama widgetContoh.php, dan letakkan di D:\xampp\htdocs\wplabz\wp-content\plugins, Anda bisa menyesuaikan sesuai dengan letak xampp Anda nanti.

Kemudian silahkan isikan dalam file php widgetContoh.php seperti di bawah ini :
...

<?php
/*
Plugin Name: Widget Sederhana
Plugin URI: http://www.ilmuwebsite.com
Description: Ini adalah Contoh Sederhana Widget dengan OOP PHP
Author: Loka Dwiartara
Version: 1.0
Author URI: http://www.ilmuwebsite.com
*/

class WidgetSederhana extends WP_Widget
{
 function WidgetSederhana() {
  $widget_options = array(
  'classname'  =>  'widget-sederhana',
  'description'  =>  'Contoh Widget Sederhana'
  );
  parent::WP_Widget('widget_sederhana', 'Widget Sederhana', $widget_options);
 }
 
 function widget( $args, $instance ) {
  extract ( $args, EXTR_SKIP );
  $title = ( $instance['title'] ) ? $instance['title'] : 'Contoh Widget Sederhana';
  $body = ( $instance['body'] ) ? $instance['body'] : 'Contoh Deskripsi Widget Sederhana Di Sini ... '
  ?>
  <?php echo $before_widget ?>
  <?php echo $before_title . $title . $after_title ?>
  <p><?php echo $body ?></p>
  <?php 
 }
 
 function form( $instance ) {
  ?>
  <label for="<?php echo $this->get_field_id('title'); ?>">
  Title: 
  <input id="<?php echo $this->get_field_id('title'); ?>"
    name="<?php echo $this->get_field_name('title'); ?>"
    value="<?php echo esc_attr( $instance['title'] ); ?>" />
  </label>
  <br />
  <label for="<?php echo $this->get_field_id('body'); ?>">
  Message: 
  <textarea id="<?php echo $this->get_field_id('body'); ?>" name="<?php echo $this->get_field_name('body'); ?>"><?php echo esc_attr( $instance['body'] ); ?></textarea>
  </label>
  <?php 
 }
 
}
 
function widget_sederhana_init() {
 register_widget("WidgetSederhana");
}

add_action('widgets_init','widget_sederhana_init');

Baiklah setelah itu save, jangan lupa letak direktorinya masih di D:\xampp\htdocs\wplabz\wp-content\plugins. Kemudian buka browser Anda dan masuk ke dalam dashboard wordpressnya. Pada praktik kali ini letak wordpress milik saya di http://localhost/wplabz/.

Silahkan masuk ke dashboardnya lalu masuk ke dalam menu plugin > Installed Plugin. Widget Sederhana sudah masuk ke dalam plugin yang sudah terinstall.

Anda tinggal aktifkan saja. Maka secara otomatis nanti masuk ke dalam widget yang sudah terdaftar. Anda bisa eksplorasi sendiri.

Untuk penjelasan detil mengenai struktur kode widget sederhana akan saya jelaskan di bagian ke 2.

Loka Dwiartara
Admin ilmuwebsite.com
Founder kaffah.biz