Hướng dẫn widget area wordpress plugin - khu vực tiện ích plugin wordpress

Widget Area không biết dịch sao cho sát nghĩa nhưng đại khái là vùng cho phép kéo thả các widget vào. Thường trong các theme WordPress đã có sẵn các Widget Area như hình dưới. Nhưng vì môt lý do nào đó, bạn cần tạo thêm nhiều Widget Area cho các blocks hoặc short-code, làm thế nào để tạo thêm bổ sung widget area cho theme WordPress? bằng plugin hay mã code?

Hướng dẫn widget area wordpress plugin - khu vực tiện ích plugin wordpress

Có hai cách tạo thêm widget area bổ sung: bằng plugin WP Custom Widget area và viết code mã vào function.php của theme:

1. Hướng dẫn thêm widget area bổ sung bằng plugin WP Custom Widget area

Để cài đặt plugin WP Custom Widget area, bạn làm các bước như sau:

+ Bước 1: tải plugin về tại đây hoặc truy cập trang chủ WP Custom Widget area.

+ Bước 2: cài đặt plugin theo các bước như hình dưới

Hướng dẫn widget area wordpress plugin - khu vực tiện ích plugin wordpress

+ Bước 3: click vào “Kích hoạt” ở màn hình tiếp để chạy pluginKích hoạt” ở màn hình tiếp để chạy plugin

+ Bước 4: Tạo widget area bạn muốn theo các bước như hình dưới:

Hướng dẫn widget area wordpress plugin - khu vực tiện ích plugin wordpress

+ Bước 5: Kiểm tra và sử dụng area bạn đã tạo như hình dưới:

Hướng dẫn widget area wordpress plugin - khu vực tiện ích plugin wordpress

2. Hướng dẫn thêm widget area bổ sung bằng mã code vào vào function.php của theme

Đăng ký một Widget Area

Bạn thêm đoạn mã sau vào function.php của theme để đăng ký một widget mới:

[code language=”php”] register_sidebar( array( ‘name’ => “Tên widget”, ‘id’ => ‘id-viet-lien-khong-dau-va-duy-nhat’, ‘description’ => “Mô tả vị trí widget”, ‘before_widget’ => ‘’, ‘after_widget’ => ‘’, ‘before_title’ => ‘’, ‘after_title’ => ‘’, ) ); [/code]Đoạn mã này sẽ khai báo với WordPress rằng bạn sẽ sử dụng một widget có ID là id-viet-lien-khong-dau-va-duy-nhat, nhớ khai báo những thông tin ở trên cho chính xác và phù hợp với thông tin mà bạn muốn nhé.
‘name’ => “Tên widget”,
‘id’ => ‘id-viet-lien-khong-dau-va-duy-nhat’,
‘description’ => “Mô tả vị trí widget”,
‘before_widget’ => ‘

  • ’,
    ‘after_widget’ => ‘
  • ’,
    ‘before_title’ => ‘

    ’, ‘after_title’ => ‘

    ’,
    ) );
    [/code]Đoạn mã này sẽ khai báo với WordPress rằng bạn sẽ sử dụng một widget có ID là id-viet-lien-khong-dau-va-duy-nhat, nhớ khai báo những thông tin ở trên cho chính xác và phù hợp với thông tin mà bạn muốn nhé.

    Đặt Widget Area mới vào theme

    Tiếp theo, chúng ta tìm đến vị trí tương ứng mà bạn muốn đặt Widget Area trong theme, tùy theo nhu cầu của mình bạn sẽ lựa chọn vị trí thích hợp và file thích hợp. Hãy xem thêm cấu trúc một theme WordPress để biết được bạn cần đặt vào file nào, vị trí nào để phù hợp với nhu cầu của mình. Phần này mình không thể giúp các bạn được nhiều rồi…

    Ở vị trí cần đặt Widget Area chúng ta bổ sung thêm đoạn mã sau: [code language=”php”] [/code]
    [code language=”php”]




    [/code]

    Đoạn mã này có nghĩa là những Widget mà chúng ta đã đặt vào vùng Widget Area có tên là id-viet-lien-khong-dau-va-duy-nhat sẽ được đặt ở vùng mã này. Bạn có thể bổ sung thêm thuộc tính id hoặc thuộc tính class cho thẻ div bao bên ngoài để tùy chỉnh CSS thêm nếu muốn.

    Xong rồi, giờ thì vào hệ thống quản trị WordPress và chọn Theme => Widget bạn sẽ thấy Widget Area mới, kéo Widget vào vùng mới bạn sẽ có thể thấy nó hiển thị ra bên ngoài.Theme => Widget bạn sẽ thấy Widget Area mới, kéo Widget vào vùng mới bạn sẽ có thể thấy nó hiển thị ra bên ngoài.

    Đơn giản và dễ dàng để tùy biến thêm tính năng cho theme bạn đang dùng phải không.

    Đăng nhập

    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.

    Hướng dẫn widget area wordpress plugin - khu vực tiện ích plugin wordpress

    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.

    Hướng dẫn widget area wordpress plugin - khu vực tiện ích plugin wordpress

    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.

    Hướng dẫn widget area wordpress plugin - khu vực tiện ích plugin wordpress

    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.

    Hướng dẫn widget area wordpress plugin - khu vực tiện ích plugin wordpress

    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.