Cấu trúc Theme WordPress

Theme WordPress là tập hợp các file PHP, JavaScript, CSS,… mỗi theme khác nhau sẽ cung cấp giao diện và chức năng khác nhau tuỳ vào nhà phát triển.

Cấu trúc Theme WordPress

Theme WordPress nằm trong các thư mục con của themes WordPress (wp-content/themes/). WordPress có thể có nhiều theme, nhưng chỉ được kích hoạt 1 theme duy nhất, trừ trường hợp child theme phải hoạt động song song với parent theme.

Theme WordPress thường bao gồm 3 loại file chúng, ngoại trừ các file hình ảnh và JavaScript.

File định danh style.css: nhiệm vụ hiển thị thông tin, bố cục theme.
Các file template: nhiệm vụ lấy dữ liệu từ database hiển thị lên trang web.
File chức năng functions.php: các chức năng của theme được viết ở đây.

Tạo theme WordPress

Sau khi đã tìm hiểu cơ bản về cấu trúc theme, mình sẽ tiến hành tạo theme cho website của mình. Chúng ta tạo một folder trong wp-content/themes/ và đặt tên tuỳ thích, nhưng tránh các tên đã có trên kho Themes WordPress.
Ví dụ mình sẽ đặt folder là nhut-dot-me thì sẽ là wp-content/themes/nhut-dot-me

Theme Stylesheet

Tạo file style.css trong folder nhut-dot-me với nội dung như sau:

/*
Theme Name: Nhut dot me
Theme URI: https://nhut.me
Author: Minh Nhựt
Author URI: https://nhut.me
Description: Đây là theme trong Series Hướng Dẫn Lập Trình Theme WordPress
Version: 1.0
Text Domain: nhut-me
*/

File style.css có nhiệm vụ khai báo cho WordPress biết thông tin của theme bao gồm, tên theme, tác giả, version, text domain,…

Lưu ý: Text Domain có nhiệm vụ hỗ trợ đa ngôn ngữ cho theme

File chức năng

Tạo file functions.php trong folder nhut-dot-me. Mình sẽ viết tất cả các chức năng của theme vào file này, ví vụ:

Nhúng CSS, JavaScript và theme.
Kích hoạt tính các năng theme như Sidebars, Menu, Post Thumbnail,…
Và một số chức năng khác mà WordPress không cung cấp.

Các file Template

Đây là các file PHP, có nhiệm vụ lấy thông tin từ database và hiển thị lên trang web dưới dạng HTML. Tạo các file sau trong folder nhut-dot-me:

index.php: khi vào trang chủ, file này sẽ được load.
header.php: hiển thị phần đầu trang web.
footer.php: hiển thị phần cuối trang web.
comments.php: hiển thị danh sách bình luận, form bình luận.
single.php: hiển thị nội dung chi tiết của bài viết.
page.php: hiển thị nội dung chi tiết của trang.
archive.php: hiển thị danh sách các bài viết được phân loại.
search.php: hiển thị nội dung tìm kiếm.
sidebar.php: hiển thị nội dung sidebar.
404.php: hiển thị thông báo lỗi không tìm thấy trang.

Còn rất nhiều file với các chức năng khác nhau, tuy nhiên trong series này mình chỉ cần bấy nhiêu là đủ. Nếu muốn tìm hiểu thêm bạn có thể xem ở đây.

File screenshot

File này không bắt buộc, tuy nhiên củng nên thêm vào để trong trang quản trị theme được hiển thị chuyên nghiệp và đẹp mắt. Kích thước khuyến khích là 1200×900, định dạng png hoặc jpg là tốt nhất, tên file bắt buộc là screenshot.