Widget có thể gọi là một tính năng mà bất kỳ một website WordPress nào cũng phải cần dùng, nó là một tập hợp các chức năng; mỗi widget tương ứng với một chức năng để bạn chèn vào sidebar [thanh bên] của theme. Chẳng hạn như bạn có thể chèn widget Recent Posts để hiển thị các bài viết mới nhất, widget Text để chèn các mã HTML vào,…v..v…Dù rằng mặc định WordPress đã cung cấp sẵn một số widget nhưng các widget có thể tăng lên tùy thuộc vào theme hỗ trợ thêm và cài plugin. có thể gọi là một tính năng mà bất kỳ một website WordPress nào cũng phải cần dùng, nó là một tập hợp các chức năng; mỗi widget tương ứng với một chức năng để bạn chèn vào sidebar [thanh bên] của theme. Chẳng hạn như bạn có thể chèn widget Recent Posts để hiển thị các bài viết mới nhất, widget Text để chèn các mã HTML vào,…v..v…Dù rằng mặc định WordPress đã cung cấp sẵn một số widget nhưng các widget có thể tăng lên tùy thuộc vào theme hỗ trợ thêm và cài plugin.
Trong khuôn khổ bài này, mình sẽ giải thích cho các bạn hiểu vai trò của widget và cách thao tác với widget mặc dù ở phần Customize mình đã có video mô tả tính năng Customize mà trong đó mình đã có cho các bạn thấy chúng ta có thể thao tác với widget trong khu vực Customize.
Thao tác với Widget
Để thao tác với Widget, các bạn có thể vào Appearance –> Customize hoặc Appearance –> Widget, nhưng ở đây mình sẽ truy cập vào Appearance –> Widget vì nó được dùng phổ biến hơn và không phải theme nào cũng hỗ trợ thao tác với widget ở khu vực Customize.Appearance –> Customize hoặc Appearance –> Widget, nhưng ở đây mình sẽ truy cập vào Appearance –> Widget vì nó được dùng phổ biến hơn và không phải theme nào cũng hỗ trợ thao tác với widget ở khu vực Customize.
Trong đó, bên tay trái là danh sách các widget mà các bạn có thể sử dụng và tay phải là các sidebar. Tùy vào theme, mà bạn sẽ có bao nhiêu sidebar, và có nhiều theme có sidebar dành riêng cho từng phần [Trang chủ, Single, Page,…] nên bạn chịu khó đọc mô tả mờ mờ bên trên nó và xem tên sidebar.
Để sử dụng widget, bạn chỉ cần click và kéo widget bên tay trái vào sidebar mà bạn muốn hiển thị widget đó mà thôi.
Hoặc là click vào widget bên tay trái và chọn sidebar cần dùng và ấn nút Add Widget, nó sẽ tự thêm vào vị trí cuối cùng của sidebar.
Sau khi thêm xong widget, mỗi widget có thể sẽ có các tùy chọn riêng biệt để bạn thiết lập nó nhằm hiển thị như ý muốn, các bạn bấm vào và tùy chỉnh lại, sau đó ấn Save để lưu lại.
Cuối cùng là ra ngoài theme và xem widget của mình đã hiển thị chưa nhé.
Thạch Phạm
Bé Thạch 18 tuổi, hiện công tác tại AZDIGI với vị trí giữ xe và viết thuê tại ThachPham.Com. Sở thích nghiên cứu về website, DevOps, SysAdmin và xăm mình nữa. Phương châm sống của bé là "No Pain, No Gain".
Hiện tại blog tạm đóng bình luận vì mình cần tập trung thời gian vào cập nhật bài viết. Bình luận sẽ mở ra cho đến khi mình sẵn sàng.
Widget trong WordPress ai cũng hiểu nó là một block nội dung được đặt trong một khu vực được chỉ định, khu vực này ta thường gọi là Widget Area hoặc Sidebar. Ngoài các widget có sẵn như Recent Posts, Recent Comments,…thì nếu muốn có thêm widget bạn phải cài plugin hoặc một số theme cũng cho bạn thêm vài widget tùy chọn.Recent Posts, Recent Comments,…thì nếu muốn có thêm widget bạn phải cài plugin hoặc một số theme cũng cho bạn thêm vài widget tùy chọn.
Vậy làm thế nào để hiểu quy trình tạo một widget ra sao? Ở bài này mình sẽ phân tích kỹ lưỡng cách tạo một widget là như thế nào, nhưng dĩ nhiên là bạn cần có sẵn kiến thức PHP ví dụ như bạn nên hiểu Class và đối tượng trong PHP là thế nào.
Khái niệm về cách tạo widget
Xem trước: Widgets API – WordPress Codex Widgets API – WordPress Codex
Trong WordPress đã có sẵn một class tên là WP_Widget, trong class này có những method [phương thức], nghĩa là bạn phải viết các phương thức này theo chuẩn của nó, không được thiếu mà cũng không có thừa và phải viết đúng tên phương thức.
Trong class
7 có tổng cộng 3 phương thức bắt buộc, bao gồm:
/*
* Khởi tạo widget item
*/
add_action[ ‘widgets_init’, ‘create_thachpham_widget’ ];
function create_thachpham_widget[] {
register_widget[‘Thachpham_Widget’];
}
__construct: Phương thức khởi tạo này sẽ có nhiệm vụ khai báo tên widget, mô tả widget.: Phương thức khởi tạo này sẽ có nhiệm vụ khai báo tên widget, mô tả widget.
form: Phương thức này sẽ hỗ trợ bạn tạo các form nhập liệu bên trong một widget, xem hình dưới.: Phương thức này sẽ hỗ trợ bạn tạo các form nhập liệu bên trong một widget, xem hình dưới.
Mẫu form trong widget
update: Phương thức này sẽ hỗ trợ bạn lưu dữ liệu mà người dùng đã nhập vào các form mà bạn đã tạo bằng phương thức form.: Phương thức này sẽ hỗ trợ bạn lưu dữ liệu mà người dùng đã nhập vào các form mà bạn đã tạo bằng phương thức form.
widget: Phương thức này sẽ giúp bạn gọi dữ liệu và hiển thị ra ngoài website khi bạn gắn cái widget này lên.: Phương thức này sẽ giúp bạn gọi dữ liệu và hiển thị ra ngoài website khi bạn gắn cái widget này lên.
Ngoài ra, trong class này bạn cũng phải khai báo một phương thức nào đó do bạn tùy chọn để thiết lập tên và mô tả của widget. Một số thì dùng phương thức
8 và một số thì tự tạo một phương thức khác. Ở đây mình chọn cách tự tạo phương thức vì nó dễ nhìn và dẽ hiểu hơn.
/*
* Khởi tạo widget item
*/
add_action[ ‘widgets_init’, ‘create_thachpham_widget’ ];
function create_thachpham_widget[] {
register_widget[‘Thachpham_Widget’];
}
Chuẩn bị
Bạn có thể thực hành bài này bằng cách viết code vào file
9 trong theme, nhưng tốt hơn hết là bạn tạo một plugin đi. Tạo một file với tên nào đó ở thư mục
/*
* Khởi tạo widget item
*/
add_action[ ‘widgets_init’, ‘create_thachpham_widget’ ];
function create_thachpham_widget[] {
register_widget[‘Thachpham_Widget’];
}
0 và viết đoạn này ở đầu file
/**
* Tạo class Thachpham_Widget
*/
class Thachpham_Widget extends WP_Widget {/**
* Thiết lập widget: đặt tên, base ID
*/
function __construct[] {}
/**
* Tạo form option cho widget
*/
function form[ $instance ] {}
/**
* save widget form
*/function update[ $new_instance, $old_instance ] {
}
/**
* Show widget
*/function widget[ $args, $instance ] {
}
}