Cách tạo thêm sidebar trong WordPress

#8 WordPress Sidebar Tạo Sidebars trong theme WordPress

Trong bài học này, chúng ta sẽ tìm hiểu về cách tạo sidebars trong theme WordPress, nơi người dùng có thể sử dụng các widget.

Video Tạo Sidebars trong theme WordPress

Hướng dẫn chi tiết

Tạo sidebar cơ bản

Trong thư mục includes, các bạn tạo file register-sidebars.php. Đây sẽ file chúng ta tiến hành khai báo các sidebar với WordPress.

Đừng quên inlcude register-sidebars.php vào file funtions.php nhé. Chúng ta dùng hàm register_sidebar để khai báo sidebar chúng ta sẽ sử dụng. Hàm này yêu cầu một tham số kiểu dữ liệu là mảng. Mảng đó chứa 1 số phần tử như sau:

• name: [string] : Tên hiển thị của sidebar trong phần Apperence -> Widget
• id: [string]: id định danh cho sidebar để WordPress có thể xác định, id này cần riêng biệt, không trùng lặp. Mặc định id sẽ có dạng sidebar-$instance
• description [string] Mô tả cho sidebar, hiển thị trong Apperence -> Widget
• class: [string] các class css chúng ta gắn thêm cho khối sidebar [nếu cần thiết]
• before_widget [string] Phần html sẽ chèn vào trước khối widget
• after_widget [string] Phần html sẽ chèn vào sau khối widget
• before_title [string] Phần html sẽ chèn vào trước tiêu đề của widget, mặc định là thẻ h2
• after_title [string] Phần html sẽ chèn vào sau tiêu đề của widget, mặc định là thẻ h2

add action cho hook widgets_init nhé

Trong thư mục chính của theme, chúng ta sẽ tạo một file có tên sidebar.php Đây là chứa template sidebar mà chúng ta đã đăng ký. Chúng ta sẽ gọi sidebar ra bằng bằng dynamic_sidebar[ id sidebar ]. Trước đó chúng ta sẽ kiểm tra sidebar đã chứa widget nào chưa, nếu có, sidebar sẽ được hiển thị.

Để hiển thị sidebar, chúng ta dùng hàm get_sidebar để hiển thị sidebar tại các template như index, single, archive

Tạo widget demo cho sidebar

Các bạn cài plugin Monster Widget để tạo ra tất cả widget có sẵn của WordPress cho sidebar của bạn và test thử nhé.

Tạo nhiều sidebar cho theme

Để tạo thêm nhiều sidebar cho theme, các bạn khai báo thêm sidebar bằng register_sidebar. Nhớ đặt id của sidebar sao cho không bị trùng.

Tạo file chứa sidebar trong thư mục chính cũa theme theo định dạng sidebar-tên sidebar.php và dynamic_sidebar[ id sidebar ].

Hiển thị sidebar trong template index, single, archive bằng hàm get_sidebar[tên-sidebar]. Lưu ý, tên sidebar trong hàm get_sidebar phải giống với phần tên sidebar trong tên file php thì WordPress mới nhận diện được.

Tài liệu WordPress

Link tài liệu chính chủ WordPress về các hàm đã dùng trong bài học nếu muốn tìm hiểu sâu hơn

• register_sidebar
• is_active_sidebar
• dynamic_sidebar
• get_sidebar
• sidebars

Code hoàn thành của bài học: Google Drive

Nếu có thắc mắc, đặt câu hỏi bằng cáchcommentbên dưới, quaemail, hoặc nhắn tin quaFanpage Góc làm web.

Đừng quênLike,Sharenếu thấy bài viết thú vị.

Liên hệ

• Video Tạo Sidebars trong theme WordPress
• Hướng dẫn chi tiết
  • Tạo sidebar cơ bản
  • Tạo widget demo cho sidebar
  • Tạo nhiều sidebar cho theme
• Tài liệu WordPress

Video liên quan