Child theme không phải là kiến thức gì mới mẻ, nhưng một số bạn có thể vẫn chưa nắm được Child Theme trong wordpress là gì nên mình viết bài này giới thiệu cho bạn nào cần. Child Theme hiểu đơn giản là một theme con và nó sẽ kế thừa toàn bộ đặc điểm của theme mẹ (Parent Theme).
Bạn có thể tạo Child Theme cho bất cứ theme nào bạn muốn. Bởi lẽ, mục đích sử dụng của Child Theme là hỗ trợ tùy biến theme mẹ mà không cần trực tiếp thay đổi trong theme mẹ.
Child Theme có gì hay mà phải dùng?
Khi cài một theme bất kỳ, chúng ta có xu hướng tiến hành chỉnh sửa trực tiếp lên theme đó như thay đổi style, code, function … Điều này sẽ rất bất tiện nếu sau này bạn update theme (đặc biệt với các theme cho phép update online) nó sẽ ghi đè tất cả các thay đổi của bạn.
Do đó, việc sử dụng Child Theme sẽ giúp bạn thoải mái tùy chỉnh code mà không sợ bị mất khi update phiên bản mới vì bạn chỉ cần update theme mẹ, còn child theme thì vẫn giữ nguyên.
Cơ chế hoạt động của Child Theme như thế nào?
Khi tạo một child theme, thì nếu bạn copy một file nào đó ở thư mục theme mẹ qua bên thư mục của child theme thì nó sẽ tiến hành thực thi file đó ở thư mục child theme, 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ẹ.
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ẹ.
Riêng file functions.php của theme mẹ mẹ sẽ không bị thay đổi dù bạn có khai báo thêm file functions.php trong thư mục child theme, mà các code bên trong file functions.php của child theme sẽ tiến hành load thêm song hành với các code bên trong file functions.php của theme mẹ.
Vì vậy, khi muốn tùy biến file nào chỉ cần copy từ theme mẹ sang child theme và thay đổi code trên file đó là được.
Làm thế nào để tạo được child theme ?
Bạn có thể tạo child theme bằng cách đơn giản sau. Vào thư mục wp-content/themes tạo thêm một thư mục mới với tên bất kỳ nhưng tốt nhất nên đặt tên giống với thư mục theme mẹ và thêm chữ -child ở đằng sau, ví du:
Theme mẹ là: Twentyseventeen
Đặt child theme: Twentyseventeen-child
Sau đó tạo một file style.css với nội dung như sau:
/*
Theme Name: Twenty Seventeen Child Theme
Theme URI: https://thuvienlaptrinh.com
Description: Twenty Seventeen Child Theme
Author: Jacob Pham
Author URI: https://thuvienlaptrinh.com
Template: Twentyseventeen
Version: 1.0
*/Lưu ý ở phần Template, ở đó bắt buộc bạn ghi tên thư mục của theme mẹ để nó hiểu đâu là mẹ, như ví dụ trên theme mẹ là Twentyseventeen.
Kế tiếp, bạn chèn thêm đoạn này vào ngay bên dưới */
@import url("../twentyseventeen/style.css");
Bạn thay twentyseventeen thành tên thư mục theme mẹ, mục đích là để nó sử dụng các CSS từ theme mẹ, cũng như có thể tiến hành ghi đè CSS mà bạn tùy chỉnh lên CSS có sẵn. Sau khi tạo file style.css ta sẽ được nội dung như sau:
/*
Theme Name: Twenty Seventeen Child Theme
Theme URI: https://thuvienlaptrinh.com
Description: Twenty Seventeen Child Theme
Author: Jacob Pham
Author URI: https://thuvienlaptrinh.com
Template: Twentyseventeen
Version: 1.0
*/
@import url("../twentyseventeen/style.css");Tiếp theo đơn giản là vào Giao diện(nếu là tiếng Việt) hoặc Appearance (Tiếng Anh) để thay đổi theme.
Những điều cần lưu ý khi sử dụng Child Theme
- Tuyệt đối không được xóa thư mục theme mẹ.
- 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.
Hy vọng kiến thức trên sẽ giúp ích cho bạn trong quá trình phát triển website wordpress. Chúc các bạn may mắn 🙂
