Wordpress Dev

Hướng dẫn tạo vùng Widget cho gói giao diện WordPress

Widget là một trong các chức năng mở rộng của WordPress, mục đích của chúng là tạo ra một vùng tùy chỉnh …

Widget là một trong các chức năng mở rộng của WordPress, mục đích của chúng là tạo ra một vùng tùy chỉnh dễ dàng cho người sử dụng chỉ việc kéo thả, và được khai báo hỗ trợ tại functions.php trong gói giao diện, được gọi ra bởi một hàm dynamic_sidebar('ID') ở bất kỳ đâu, sau đây mình xin chia sẻ với các bạn cách tạo một vùng widget để các bạn tha hồ kéo thả tùy chỉnh cho giao diện của mình nhé.

Trước tiên, bạn mở file functions.php lên, sau đó chạy hàm sau:

function medex__widgets_init() {
    register_sidebar( array(
        'name' => 'Sidebar',
        'id' => 'sidebar',
        'description' => 'Quảng cáo bên sidebar (300 x 300)',
        'before_widget' => '<div class="innersidebar">',
        'after_widget' => '</div>',
        'before_title' => '<h3>',
        'after_title' => '</h3>'
    ) );
}
add_action( 'widgets_init', 'medex__widgets_init' );

Trong đó có các thông số như sau:

  • Name: Tên của Sidebar, sẽ được hiển thị đầu tiên để gợi ý cho người dùng
  • ID: Cần phải độc nhất, dùng để gọi trên vùng Widget trong giao diện
  • Description: Mô tả thêm cho Name
  • Before_widget: Thẻ div hoặc bất cứ thứ gì để bọc bên ngoài vùng Widget
  • After_widget: Bọc ngoài vùng Widget nhưng thường là đóng thẻ của before_widget !
  • Before_title: Thường quy định thẻ heading cho mỗi vùng Widget
  • After_title: Thường là đóng thẻ của Before_title

Ta sẽ được một vùng Widget trong GIAO DIỆN > WIDGET như sau:

Vùng Widget vừa tạo xong đã xuất hiện trong admin để sẵn sàng cấu hình

Vùng Widget vừa tạo xong đã xuất hiện trong admin để sẵn sàng cấu hình

Tiếp theo, nó chưa xuất hiện đâu, các bạn mở file sidebar.php trong gói giao diện lên, gọi chúng bằng hàm dynamic_sidebar('ID') như sau:

<div id="sidebar">
<?php dynamic_sidebar('sidebar') ?>
</div>

Vậy là chúng sẽ hiển thị widget có ID là sidebar đã được khai báo từ trước, giờ thì thử assign bất kỳ cái widget nào có sẵn trong admin, kéo thả chúng vào vùng sidebar và thưởng thức thôi !

Sidebar đã hiển thị bài viết mới nhất với code tôi vừa tạo

Sidebar đã hiển thị bài viết mới nhất với code tôi vừa tạo

Ngoài việc kéo thả, Widget còn có thể làm được nhiều thứ hơn bạn nghĩ, ví dụ như Menu tự tạo, bài đăng liên quan hoặc slide ảnh của bạn, tùy vào cách bạn dùng nó thế nào !

Chúc các bạn thành công !

Thông tin liên quan