Dengan adanya Widget WordPress, mejadikan mudah bagi pengguna untuk hanya drag dan drop elemen ke situs mereka. Ada banyak tema WordPress dan plugin yang menggunakan widget untuk memungkinkan pengguna untuk membuat layout sendiri. Bahkan ada plugin untuk meningkatkan manajemen widget. Pada artikel ini, Saya akan menunjukkan cara untuk membuat widget kustom Anda sendiri WordPress. Tentunya tutorial ini hanyalah tutorial sederhana, untuk pengembangan yang lebih komplek dan sesuai dengan keinginan anda, silahkan kembangkan sendiri.

Baca : Apa dan kegunaan Widget WordPress?

Membuat Widget di WordPress

Plugin ini hanya akan berisi Title dan isi yang sudah di tuliskan di dalam code, cuman sekedar plugin dengan tulisan output Hello Word. untuk membuatnya, silahkan buka file functions.php theme wordpress Anda.

/* Membuat widget */
class test_widget extends WP_Widget {

function __construct() {
parent::__construct(
// ID widget
'test_widget', 

// nama widget
__('Centerklik Widget', 'test_widget_domain'), 

// Widget deskripsi
array( 'description' => __( 'Contoh Tutorial Widget sederhana', 'test_widget_domain' ), )
);
}

// Membuat widget front-end
public function widget( $args, $instance ) {
$title = apply_filters( 'widget_title', $instance['title'] );
// sebelum dan sesudah widget argumen ditentukan oleh tema
echo $args['before_widget'];
if ( ! empty( $title ) )
echo $args['before_title'] . $title . $args['after_title'];

// Code yang akan ditampilkan
echo __( 'Hello, World!', 'test_widget_domain' );
echo $args['after_widget'];
}

// Widget Backend
public function form( $instance ) {
if ( isset( $instance[ 'title' ] ) ) {
$title = $instance[ 'title' ];
}
else {
$title = __( 'New title', 'test_widget_domain' );
}
// Widget admin form
?>
<p>
<label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:' ); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo esc_attr( $title ); ?>" />
</p>
<?php
}
/*Akhir Widget */

Setelah anda menyimpan kode diatas, langsung masuk ke dashboard wordpress anda dan ke menu Appearance » Widgets, drag and drop Centerklik Widget di sidebar anda untuk menampilkan widget kustom ini pada sidebar.

Untuk intruksi code widget sederhana tersebut sudah saya tuliskan di script code diatas, silahkan pahami dan pelajari alur code tersebut. Semoga membantu menambah pengetahuan anda tentang wordpress dan widget. 🙂

Anda Terbantu artikel ini? Silahkan bergabung dengan centerklik di Twitter dan Facebook+.