Child Theme WordPress là gì ? Tại sao phải tạo Child Theme ?

Child Theme là một tính năng tuyệt vời của WordPress. Nó được cho phép bạn thêm – sửa – xóa đoạn code trong những file của giao diện Parent Theme trong WordPress mà không bị mất đi khi tất cả chúng ta update giao diện .

Sau khi đã nắm rõ những kiến thức trong hướng dẫn WordPress cơ bản thì điều tiếp theo bạn muốn cá nhân hóa là Giao diện đúng không nào ? Nhưng mỗi lần update giao diện thì phần custom đó lại mất đi.

Thế là bạn phải làm lại từ đầu. Khá là cực đúng không ?
Nhưng đó là một cách tốt để WordPress bảo vệ bạn khỏi bị Hack đấy. Thông thường tin tặc sẽ chèn vào những đoạn code Malware vào những file giao diện khiến bạn khó mò ra nếu không có kinh nghiệm tay nghề bảo mật thông tin WordPress .

Vì vậy mỗi khi update version theme mới thì WordPress sẽ xóa tất cả dữ liệu cũ đi và thay thế dữ liệu mới vào. Đồng nghĩa với việc những đoạn code Malware cũng sẽ bị loại bỏ.

Vậy làm thế nào để vừa tùy chỉnh được giao diện vừa bảo vệ được tính bảo mật thông tin ?
Đó là lí do bạn cần đến Child Theme .
How to Create Child Themes in WordPress

Child Theme là gì ?

Child Theme (CT) là một clone của Parent Theme (Theme bạn đang kích hoạt). Child Theme kế thừa toàn bộ từ tính năng đến giao diện của Parent Theme.

Như vậy thì có ích gì ? Nếu clone ra thêm 1 theme nữa không phải sẽ làm Hosting tốn thêm nhiều tài nguyên hơn hay sao ?

Trả lời: Child Theme chỉ thừa hưởng tính năng và giao diện của Parent Theme. Còn tất cả những folder, file đều là của Parent Theme hết. Như thế bạn sẽ dễ dàng tùy chỉnh Child Theme theo ý của mình, không phải lo lắng về nguy cơ mất những thay đổi mỗi khi update version theme.

Child Theme hoạt động giải trí như thế nào ?

Khi bạn kích hoạt CT cho Theme hiện hành, WordPress sẽ hiểu là Parent Theme đang có CT. Nó sẽ ưu tiên truy vấn vào Child Theme để tìm xem có những biến hóa gì tại CT hay không. Nếu có những tùy chỉnh thì WordPress sẽ hiển thị lên trước, sau đó sẽ load những phần còn lại từ Parent Theme .
Child Theme hoạt động như thế nào ?

Ví dụ:

Website của Cuồng Team sử dụng Theme GeneratePress, mình đã cá thể hóa nó bằng cách :

  • Thêm mã Google Analytics vào file header.php .
  • Thêm code tùy chỉnh phân trang vào file single.php .
  • Thêm tính năng hiển thị bài viết tương quan vào file single.php .
  • … … ..

Nếu đã kích hoạt CT thì WordPress sẽ truy vấn vào những file mà mình đã tùy chỉnh trước như : header.php, footer.php, single.php, …. ở Child Theme sau đó thì truy vấn vào những file còn lại ở Parent Theme .
Vậy làm thế nào để WordPress hiểu là những file đã tùy chỉnh ấy của CT hay là của Parent Theme ?

Hướng dẫn tạo Child Theme

Đối với những theme văn minh như Flatsome, Avada, Be Theme, … thì họ đã thêm sẵn vào đó tính năng tạo CT. Bạn chỉ việc click vài cái là done !
Còn những theme được tối ưu nhẹ nhất hoàn toàn có thể để làm trang Blog thì thường sẽ không có tính năng này .

Tạo Child Theme bằng plugin

Nếu lười thì bạn tải plugin này về cho lẹ nhé: Child Theme Configurator

Sau khi kích hoạt lên thì bạn vào Công cụ -> Child Themes để tiến hành cài đặt.

Chọn CREATE a new Child Theme ở Step 1 và chọn theme muốn làm Child Theme ở Step 2. Sau đó click Analyze

Cài đặt plugin

Tại bước 4, plugin cho phép chúng ta đặt tên cho CT theo ý muốn của mình, theo Cuồng Team thì cấu trúc chung vẫn là: [Tên Theme + Child]

Đặt tên mới cho Child Theme

Tiếp theo tại bước 7, chúng ta có thể chỉnh sửa các thuộc tính như name, author, description, tags, verison theo ý của mình. Nếu không thích thì có thể giữ nguyên.

Chỉnh sửa name, description, author, tag, version, ...

Bước 8: đây là bước QUAN TRỌNG.

Đây là bước copy toàn bộ Menu, widget và các customizer của Parent Theme sang Child Theme. Khuyến khích các bạn chỉ nên tích vào 1 lần duy nhất. Mọi tùy chỉnh sau này sẽ làm tại CT luôn. Không cần tích vào nữa.

Copy toàn bộ Menu, widget và các customizer của Parent Theme

Cuối cùng thì Create New Child Theme thôi !

Cuối cùng thì click to run thôi

Khi đã Create xong bạn chuyển qua tab File nhé. Đây là bước copy những file cần chỉnh sửa từ Parent Theme sang Child Theme

Copy file từ Theme Mẹ

* Lưu ý:

  • Riêng file Functions.php đã được khởi tạo tự động nên bạn không cần phải copy qua nữa.
  • Để tùy chỉnh CSS thì bạn vào Tab Child Styles nhé hoặc xem tiếp ở Step cuối cùng.

Step cuối cùng

Vào Giao diệnSửa giao diện.

Tại đây bạn chọn giao diện Child Theme mà mình đã đặt tên. Sau đó chỉ cần tìm file cần chỉnh sửa thôi .
Như mình đã nói ở trên. WordPress sẽ ưu tiên hiển thị những file ở CT trước. Sau đó sẽ hiển thị những file còn lại ở Parent Theme .
Chỉnh sửa file đã copy từ Parent Theme

Tạo Child Theme bằng tay không

Nếu bạn không thích dụng plugin vì gây chậm website hay đã có nhiều plugin rồi thì bạn làm theo cách này nhé .

Bước 1: Vào thư mục public_html / wp-content / themes / 

Tạo 1 thư mục và đặt tên cho nó. Ví dụ : Flatsome-Child

Bước 2: Vào folder vừa tạo để tạo thêm 1 file CSS Style đặt tên là: style.css

Bước 3: Mở file Style.css và thêm đoạn này vô:

123456789

/ *

Theme Name : Tên-Theme-Đã-Tạo

Theme URI : Tên-Website-Của-Bạn

Description : Mô-Tả

Author : Tác-Giả

Author URI : URL-Tác-Giả

Template : Tên-Parent-Theme

Version : 0.1.0

* /

CustomCSSgoesafterthisline

  • Lưu ý:

    • Bạn phải nhập đúng tên Parent Theme tại mục Template nhé. Nhập sai là nó không nhận đâu !!!

Bước 4: Tạo thêm 1 file function.php và thêm tiếp đoạn code này nữa. Đây là đoạn code dùng để import file CSS từ Parent Theme sang.

123456

php < / p

add_action(‘ wp_enqueue_scripts ‘,’ enqueue_child_theme_styles ‘,PHP_INT_MAX);

functionenqueue_child_theme_styles(){

wp_enqueue_style(‘ parent-style ‘,get_template_directory_uri().’ / style.css ‘);

}

? >

Bước 5: Saved lại và hãy vào Giao diện / Giao diện và bạn sẽ thấy Child Theme của mình trong đó. Bạn cần nhấp vào nút kích hoạt để bắt đầu sử dụng CT trên trang web của mình.

Vì chưa đổi khác bất kể điều gì trong CT của mình nên website của bạn sẽ sử dụng toàn bộ những công dụng và giao diện của theme gốc .

Kết luận

Child Theme rất có ích cho việc tùy chỉnh giao diện của website. Đây là một tính năng không-thể-thiếu so với 1 website nào .
Hy vọng bài viết san sẻ của Cuồng Team đã giúp bạn hiểu được vì sao phải tạo CT và cách tạo CT .

Nếu trong quá trình làm gặp phải trục trặc hay thắc mắc gì các bạn hãy comment bên dưới nhé. Đội ngũ của Cuồng Team sẽ support nhiệt tình.

Xem thêm: 12 Cách Bảo Mật Cho Website WordPress Tránh Bị Hack

( Visited 1.117 times, 1 visits today )

5/5 - (1 vote)

Bài viết liên quan

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments