Sử dụng “Child Theme” cho blog WordPress

“Child theme” là gì và tại sao lại xài nó ?

Như bạn thấy thì blog đã được tôi thay đổi giao diện. Giao diện mới này sướng cái là mọi thay đổi có thể thực hiện thông qua trang cấu hình của theme nhưng cũng có nhiều thứ không thể làm được, lúc đó phải chui vào mã nguồn của theme để chỉnh sửa.

Dạo gần đây, theme tôi đang xài liên tục yêu cầu update để fix lỗi bảo mật, nó luôn kèm theo câu thông báo “mọi thiết lập có thể bị mất” khiến tôi … gõ bàn phím không yên :)) .Đó là bởi vì tôi đã sửa mã nguồn khá nhiều và giờ không nhớ là mình đã sửa những tập tin nào trong theme. Nếu như theme update thì nó sẽ xóa hết (ghi đè) những tập tin này. Tương tự, tôi cũng đã sửa mã nguồn của plugin WooCommerce và sau này nếu plugin này update thì có thể phần chỉnh sửa cũng sẽ bị mất.

Về cơ bản thì “Child theme” chỉ là một thư mục rỗng với duy nhất một tập tin “style.css”. Phần khai báo của tập tin này sẽ chỉ cho WordPress biết đâu là theme gốc của bạn. Khi blog được truy cập, WordPress sẽ tự “mò” vào thư mục child trước, nếu nó cần tập tin A mà không có thì nó sẽ vào thư mục theme gốc để tìm và load lên. Vì đặc điểm này nên nếu bạn muốn chỉnh sửa tập tin nào trong theme thì chỉ cần copy tập tin đó vào thư mục child rồi chỉnh sửa lại theo ý là được.

Cách tạo một “Child theme” như sau :

– Giả sử thư mục theme gốc của bạn có tên là “anhhangxom” (…/wp-content/themes/anhhangxom) ,hãy tạo thư mục “anhhangxom-child” (…/wp-content/themes/anhhangxom-child)

– Tạo mới tập tin “style.css” trong thư mục “anhhangxom-child” với các dòng thông tin bắt buộc sau :

[quote]
/*
Theme Name: anhhangxom Child
Template: anhhangxom
*/

@import url(“../anhhangxom/style.css”);
[/quote]

Có 3 lưu ý :

1. Phần “Theme name” : chỉ nên có 1 khoảng trắng và có chữ “Child” ở cuối.
2. Phần “Template” : chỉ định tên theme gốc
3. Phần “@import” : chỉ định đường dẫn tập tin “style.css” của theme gốc.

– Sau khi tạo xong, trong danh sách Theme của WordPress sẽ xuất hiện “anhhangxom Child” > bạn active theme này là xong.

Như đã nói bên trên, nếu bạn muốn chỉnh sửa tập tin nào trong theme gốc thì chỉ cần copy nó vào “Child theme” (nhớ giữ nguyên cấu trúc thư mục) và chỉnh sửa theo ý. Ví dụ, tôi muốn chỉnh sửa tập tin “loop.php” có đường dẫn là

“…/wp-content/themes/anhhangxom/includes/loop.php”

Tôi sẽ copy nó vào thư mục “Child theme” với cấu trúc thư mục được giữ nguyên :

“…/wp-content/themes/anhhangxom-child/includes/loop.php”

Theo lý thuyết thì mọi tập tin trong theme gốc sẽ bị ghi đè (load) hoàn toàn bởi các tập tin tương ứng (nếu có) trong thư mục “Child theme”. Nhưng có 2 ngoại lệ là tập tin “style.css” và tập tin “functions.php”. Nếu trong “Child theme” có tồn tại 2 tập tin này thì WordPress sẽ tự động “ghép” chúng với tập tin tương ứng trong theme gốc, thay vì ghi đè như các tập tin khác. Giả sử bạn cần thêm mới một hàm thì hãy tạo tập tin “functions.php” trong “Child theme” và viết hàm trong đó. Nếu bạn muốn chỉnh sửa hàm thì hãy copy hàm đó và sửa lại theo ý, giữ nguyên tên hàm và WordPress sẽ tự động ghi đè lên hàm đã có sẵn trong theme gốc.

Tương tự với plugin. Nếu bạn muốn chỉnh sửa mã nguồn của một plugin nào đó thì hãy tạo ra “Child theme”, sau đó tạo một thư mục con cùng tên với plugin bạn muốn chỉnh sửa và chép các tập tin bạn đã chỉnh sửa vào đây. Tôi ví dụ, tôi có chỉnh sửa mã nguồn của plugin WooCommerce, thay vì chỉnh sửa trực tiếp file gốc, tôi copy chúng vào “Child theme” để chỉnh sửa theo đường dẫn

“…/wp-content/themes/anhhangxom-child/woocommerce/”

Có một lưu ý quan trọng khi sử dụng “Child theme” : nếu theme gốc (hoặc plugin) của bạn có phiên bản update mới, bạn hãy xem danh sách các tập tin sẽ bị thay đổi. Nếu có tập tin nào trùng với tập tin mà bạn đã chỉnh sửa (lưu trong “Child theme”) thì bạn phải xóa tập tin tương ứng trong “Child theme”, chỉnh sửa lại tập tin gốc và lưu vào “Child theme”, như vậy mới đảm bảo mọi thứ chạy ổn định.

Hướng dẫn tạo và mọi thứ liên quan tới Child theme bạn có thể tham khảo tại : http://codex.wordpress.org/Child_Themes

Nguồn: https://anhhangxomonline.net/su-dung-child-theme-cho-blog-wordpress/