Cộng đồng sử dụng mã nguồn CMS WordPress ngày càng đông như quân nguyên mông. Thắng áp đảo các CMS khác, cũng chính vì nhiều người sử dụng nên các plugin mở rộng cực kỳ phong phú và đa dạng. Rất nhiều các theme bản thương mại cao cấp và chuyên nghiệp đã ra đời với giá vô cùng hạt rẻ, ai cũng có thể tiếp cận được.
Tại sao nên sử dụng Child Theme
Khi bạn sử dụng theme có bản quyền thường được cập nhật định kỳ dẫn đến những chỉnh sửa trước đó sẽ mất, nếu bạn sửa trực tiếp vào theme và khi theme update. Sẽ mất rất nhiều thời gian để khôi phục lại. Đó cũng là lý do của bài viết này sẽ hướng dẫn các bạn cách tạo và sử dụng child theme (giao diện con) cho theme gốc của bạn.
Child Theme là giúp bạn chỉnh sửa theme theo ý muốn mà không mất các tuỳ biến này khi theme được cập nhật.
Thực chất của quá trình tạo child theme là tạo ra một theme con đại diện cho theme mẹ để làm việc với hệ thống cms wordpress và mọi thứ của theme mẹ đều được theme con kế thừa.
Child Theme hoạt động như thế nào?
Khi bạn tạo một child theme, bạn cần tạo cấu trúc thư mục và file tương tự như Theme Mẹ (parent theme – theme gốc). Dựa theo cấu trúc đó, khi bạn sử dụng theme child thì các file trong thư mục child theme sẽ được thực thi. Trường hợp nếu thư mục child theme thiếu file nào thì nó sẽ thực thi file bên thư mục Theme Mẹ (parent theme).
Ví dụ, thư mục child theme của mình chỉ có mỗi file style.css, thì lúc đó ngoại trừ file style.css, các file khác đều thực thi từ thư mục theme mẹ. Nếu copy file single.php từ thư mục theme mẹ sang child theme thì nó sẽ ưu tiên thực thi file single.php ở thư mục child theme, còn các file khác nó vẫn thực thi ở thư mục theme mẹ.
Chú ý
Riêng file style.css và file functions.php sẽ được thực thi song song, có nghĩa là muốn viết thêm các function bạn có thể viết trong child theme.
Vì vậy có thể hiểu rằng, khi sử dụng child theme mà muốn tùy biến file nào thì chỉ cần copy file đó qua thư mục child theme và tiến hành chỉnh sửa nó, không cần đụng chạm gì tới theme mẹ.
Cách tạo child theme
Vào thư mục wp-content/themes trên mã nguồn cms wordpress của web tạo thêm một thư mục mới với tên với tên bất kỳ có đuôi là child.
Tạo file cho thư mục child theme:
File style.css với nội dung như dưới:
/*
Theme Name: Vouchers Child Theme
Theme URI: http: //vouchers.vn
Description: child theme voucher
Author: ictsharing
Author URI: https://ictsharing.com
Template: vouchers
Version: 0.1
*/
@import url("../vouchers/style.css");
/*---------------------------------
Write your css code from here
------------------------------------*/
Trong đó:
- Dòng Template: vouchers đó là tên của thư mục theme Mẹ.
- Dòng @import url(“../vouchers/style.css”); bạn thay vouchers thành tên thư mục theme mẹ, mục đích là để nó sử dụng các css từ theme mẹ.
File functions.php: có thể viết thêm các hàm php phục vụ cho chức năng của site.
<?php
/**
*
* vouchers child theme functions and definitions
*/
?>
Tiếp theo bạn vào Appearance -> Themes và kích hoạt child theme lên mà thôi.
Quy tắc sử dụng Child Theme
Khi bạn sử dụng theme thương mại thường xuyên nhận được thông báo nâng cấp, để việc nâng cấp diễn ra bình thường bạn cần tuyệt đối tuân theo các qui tác dưới để sửa child theme.
- Giữ nguyên thư mục theme mẹ, tuyệt đối không được xóa thư mục này.
- Muốn tùy biến file .php nào, hãy copy nó từ thư mục theme mẹ sang child theme và sửa ở child theme.
- Khi viết CSS, luôn viết dưới dòng @import ở child theme.
- Trường hợp bạn cần tuỳ biến các file PHP mà không thuộc template của theme thì hãy require nó vào file functions.php như bên theme mẹ đã làm. Bạn xem file functions.php của theme mẹ để xem nó require bằng cách nào rồi làm y vậy.
Bài viết chia sẻ cách sử dụng Child Theme hy vọng sẽ giúp ích cho các bạn đang sử dụng CMS WordPress để làm web, đặc biệt cho các bạn mua theme thương mại về sử dụng muốn sửa đổi theme và vẫn đảm bảo việc nâng cấp được diễn ra như bình thường.