Chào mừng bạn đã quay trở lại với dự án ebook hướng dẫn thiết kế theme wordpress

Nội dung của bài học hôm nay: đi tìm hiểu về cách chúng ta tạo ra một widget

Nếu bạn đã từng sử dụng wordpress thì không mấy xa lạ với khái niệm widget, chính khái niệm này đã làm cho wordpress gần gũi với người sử dụng hơn, hôm nay tôi và bạn sẽ đi tìm hiểu như thế nào để tạo ra một widget nhé

Trước tiên là cú pháp của nó:

class ten_widget extends WP_Widget

{

function ten_widget (){

$widget_ops = array(‘description’ => ‘Mô tả về chức năng của widget’);

$control_ops = array(‘width’ => 300, ‘height’ => 300); độ rộng và độ cao của widget

parent::WP_Widget(false,$name=’example’,$widget_ops,$control_ops); tên của widget. Ở đây tôi đặt tên cho nó là example

}

function form($instance){

$instance = wp_parse_args( (array) $instance, array(‘ truong_cua_form ‘=>”) );

$truong_cua_form = htmlspecialchars($instance[' truong_cua_form ']);

echo ‘

get_field_id(‘ truong_cua_form ‘) . ‘”>’ . ‘Nhập gì vào đây nhỉ:’ . ‘get_field_id(‘ truong_cua_form ‘) . ‘” name=”‘ . $this->get_field_name(‘ truong_cua_form ‘) . ‘” >’. $ truong_cua_form .’

’;

}đây là form khi bạn kéo và thả vào khu widget của theme nó sẽ xuất hiện, tùy theo nhu cầu bạn có thể định nghĩa nhiều trường ở đây tôi ví dụ một trường. Bạn lưu ý truong_cua_form nhé

function update($new_instance, $old_instance){

$instance = $old_instance;

$instance[' truong_cua_form '] = stripslashes($new_instance[' truong_cua_form ']);

return $instance;

}Sau khi tạo ra form rồi, bây giờ chúng ta muốn lưu nó vào cơ sở dữ liệu đúng không nào, và hàm này làm chức năng như vậy

function widget($args, $instance){

extract($args);

$aboutText = empty($instance[' truong_cua_form]) ? ” : $instance[' truong_cua_form '];

?>

}

}Đây là hàm in ra giá trị mà chúng ta vừa mới nhập vào khi tạo widget

register_widget(‘ ten_widget); làm xong rồi phải đăng ký thì khi đăng nhập vào khu admin mới thấy widget mình vừa tạo

Tóm lại:

1.Một widget có tùy chọn thì cấu trúc đầy đủ phải là:

class ten_widget extends WP_Widget

{

function ten_widget (){} hàm dựng là hàm thực hiện đầu tiên khi lớp ten_widget được gọi

function form(){} hàm tạo form

function update(){} hàm cập nhật giá trị người dùng nhập vào

function widget(){} hàm hiển thị những gì người dùng nhập vào ra ngoài trang (chỗ có định nghĩa sidebar, thường nếu là blog thì ở bên phải đó bạn)

}

2.Một widget không có tùy chòn thì cấu trúc chỉ cần:

class ten_widget extends WP_Widget

{

function ten_widget (){}

function widget(){echo “In ra nội dung gì đây hả bạn”}

}

Ứng dụng bài học chúng ta tạo ra một widget tên là hello, nhiệm vụ của nó là in ra chữ hello ở thanh sidebar

class hello extends WP_Widget

{
function hello(){
$widget_ops = array('description' => 'In ra chữ hello');
$control_ops = array('width' => 300, 'height' => 300); parent::WP_Widget(false,$name='hello widget',$widget_ops,$control_ops);
}
function widget(){
echo ' hello';
}
}

Bạn copy tất cả lệnh trên vào file function.php và đăng nhập vào admin sẽ thấy một widget tên là hello widget, bạn kéo thả vào sidebar và ra ngoài trang chủ sẽ thấy chữ hello, bạn có thể viết bất cứ thứ gì thay cho chữ hello đúng không

Bài học hôm nay tạm dừng tại đây, hẹn gặp lại bạn ở bài tiếp theo