Vùng Widget đã được tạo

Hướng dẫn tạo vùng Widget bất kì trên WordPress

Widget dạng kéo thả là một trong những tiện ích tuyệt vời của WordPress và được nhúng mặc định trong CMS, tuy nhiên để có được một vùng Widget trên giao diện để bạn tha hồ trình bày ý tưởng thì không phải bạn nào cũng có thể thành thạo làm được, sau đây mình xin chia sẻ cách chi tiết tạo một vùng Widget nhé.

Bước 1: Các bạn mở file functions.php của gói giao diện đang hoạt động lên, sau đó thêm vào hàm sau:

function medex__widgets_init() {
    register_sidebar( array(
        'name' => 'Trang chủ',
        'id' => 'homepage',
        'description' => 'Hiển thị trang chủ theo ý thích của bạn',
        'before_widget' => '<div class="innerhome">',
        'after_widget' => '</div>',
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>'
    ));
}
add_action( 'widgets_init', 'medex__widgets_init' );

Và khi bạn truy cập Admin > Giao diện > Widget sẽ nhìn thấy kết quả như sau:

Vùng Widget đã được tạo
Vùng Widget đã được tạo

Tuy nhiên, Vùng WIdget bây giờ có kéo thả thoải mái cũng không hiển thị bất kì thứ gì ở đâu, cho nên các bạn cần phải gọi nó cho nó hiển thị đúng theo yêu cầu, trong trường hợp này tôi sẽ cho nó hiển thị widget trang chủ trên trang chủ, tôi mở file front-page.php, trong trường hợp của các bạn có thể là file Index.php nhé.

if (is_active_sidebar('homepage')) { ?>
        <div id="Custome-homepage">
            <?php dynamic_sidebar('homepage') ?>
        </div>
    <?php
}

Hàm này sẽ check là vùng widget có được kích hoạt không để hiển thị, bạn có thể bỏ qua phần kiểm tra, tuy nhiên vì mình cần lồng thêm một thẻ div vào đằng trước nó để tiện phân cột nên phải kiểm tra !

Và giờ tất cả những thứ gì bạn kéo thả vào trong vùng Widget này đều sẽ được hiển thị tại trang chủ !

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

TÁC GIẢ:

Tôi là Jam, thâm niên 7 năm thiết kế website và làm SEO. Hãy theo dõi blog của tôi để nhận được nhiều chia sẻ thú vị xung quanh chủ đề công nghệ.

Có 5 bình luận !

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *