Child Theme là gì? Tạo Child Theme trong WordPress dễ dàng

Child Theme là gì? Tạo Child theme cho website WordPress như thế nào? Trong bài viết này, bạn sẽ được giải đáp hết các thắc mắc này.

Nếu bạn cài đặt và sử dụng Child theme cho website WordPress của mình, khi bạn muốn chỉnh sửa lại giao diện thì vào phần child theme để thiết lập. Mỗi khi parent theme ( theme cha ) được cập nhật thì các cài đặt, giao diện website mà bạn đã chỉnh sữa trong child theme WordPress không bị mất đi.

Child Theme WordPress là gì?

Child theme là một kiểu theme con, sở hửu tất cả thiết kế, chức năng của theme cha. Child theme có thể truy xuất tất cả các file dữ liệu từ theme cha. Khi bạn cài đặt và sử dụng child theme, Website WordPress sẽ ưu tiên truy xuất những thiết lập, cấu hình từ child theme trước. Điều đó có nghĩa là: trang web của bạn sẽ sử dụng nội dung của child theme, những tập tin thiếu nó sẽ lấy tiếp từ theme cha.

Lợi ích khi sử dụng Child Theme là gì?

Mỗi khi theme update lên phiên bản mới thì những chỉnh sửa, tùy biến cho website mà bạn thực hiện trước đó sẽ không bị ảnh hưởng. Đó là lợi ích tuyệt vời khi tạo Child theme cho website WordPress. Mọi chỉnh sửa CSS, code của bạn đều được giữ lại và thực hiện thông qua child theme.

Hơn thế nữa, nó cho phép bạn theo dõi và sữa chữa một cách dễ dàng và nhanh chóng các phần bạn đã tùy chỉnh, thêm vào website vì các tập tin cài đặt của một child theme tách biệt với các file theme cha mẹ gốc của nó.

Nếu không muốn tất cả công sức vất vả tùy biến theme, CSS đổ sông đổ biển, thì hãy tạo ngay cho website của mình 1 Child theme nhé!

2 cách tạo Child Theme trong WordPress dễ dàng

1. Tạo Child Theme thủ công

Giao diện theme cha mà bạn cài đặt cho website WordPress của mình nằm ở wp-content/themes. Chúng ta sẽ bắt đầu tạo Child theme tại đây. Đầu tiên, bạn tạo thư mục child theme cho mình.

Ví dụ: mình đã sử dụng theme jnews cho website của mình, vì vậy wordPress đã tự động cài đặt thư mục jnews. Bây giờ, chúng ta tạo 1 thư mục cho Child theme với cấu trúc “tên theme cha – child“. Như hình dưới, mình tạo thư mục là jnews-child:

Trong thư mục jnews-child, bạn có 3 file như hình dưới:

• screenshot.png là file chúng ta sẽ copy ở thư mục jnews qua để làm ảnh đại diện cho child theme.
• functions.php và style.css là 2 tệp tin không thể thiếu, mình tạo ra bằng cách bấm vào + File.

Sau đó, bạn bấm vào Edit chỉnh sửa file style.css, copy đoạn code sau vào và lưu lại:

/*
Theme Name: jnews Child
Template: jnews
Version: 1.0
*/

Ở đây, các dòng có ý nghĩa như sau:

• Theme Name là tên của child theme gồm “tên theme cha” và “Child”.
• Template là tên của theme cha. Bạn phải ghi đúng tên của giao diện cha mà bạn sử dụng thì child theme tạo ra mới hoạt động được. Ở đây theme cha của mình là “jnews”
• Version : cứ điền 1.0 là được

Sau đó, để giao diện này có thể truy xuất đến file styles.css của giao diện cha (nằm trong thư mục jnews/style.css), bạn cần copy đoạn code dưới đây và dán vào file function.php mà bạn đã tạo ở trên như sau:

<?php
// Exit if accessed directly
if ( !defined( 'ABSPATH' ) ) exit;

// BEGIN ENQUEUE PARENT ACTION
// AUTO GENERATED - Do not modify or remove comment markers above or below:

if ( !function_exists( 'chld_thm_cfg_locale_css' ) ):
    function chld_thm_cfg_locale_css( $uri ){
        if ( empty( $uri ) && is_rtl() && file_exists( get_template_directory() . '/rtl.css' ) )
            $uri = get_template_directory_uri() . '/rtl.css';
        return $uri;
    }
endif;
add_filter( 'locale_stylesheet_uri', 'chld_thm_cfg_locale_css' );

// END ENQUEUE PARENT ACTION

Cấu hình xong nhớ lưu file lại.

Bây giờ, mình vào Giao diện (Appearance) trong trang quản lý admin WordPress. Một giao diện mới jnews Child đã được tạo ra. Mình sẽ kích hoạt Child Theme này như các theme bình thường khác. Bạn cài đặt Child theme của mình xong nhớ kích hoạt nó nhé!

Coi lại giao diện website ngoài trang chủ, nếu bố cục và màu sắc vẫn bình thường như trước là thành công.

2. Tạo Child Theme WordPress bằng plugins

Plugin giúp bạn tạo Child theme nhanh chóng và dễ dàng đó là Child Theme Configurator.

Bước 1: Trước tiên bạn cần cài đặt và kích hoạt plugin Child Theme Configurator.

Bước 2: Sau khi kích hoạt xong, bạn vào Công cụ (tools) -> Child Themes -> Ở tab Parent/Child

Select a Parent Theme: Chọn theme cha mà bạn muốn tạo Child Theme cho nó. Bấm nút Analyze để plugin phân tích.

Bước 3: Sau khi phân tích xong, plugin sẽ đưa ra danh sách tùy chọn. Bạn giữ nguyên và nhấn nút Create New Child Theme để bắt đầu tạo child theme.

Tạo child theme xong, bạn có thể xóa plugin Child Theme Configurator nếu không dùng đến nữa. Một số plugin đi kèm theme cha có thể bị ngừng kích hoạt khi bạn tạo child theme. Bạn hãy vào mục Plugins và kích hoạt lại chúng.

Cuối cùng, chỉ mất 1-2 phút là bạn đã có 1 Child theme. Rất nhanh gọn và dễ dàng, không mất thời gian như cách làm thủ công!

Những lưu ý khi cài đặt và sử dụng Child Theme là gì?

• Nếu xóa Theme cha, website sẽ không hoạt động. Hãy giữ nguyên mọi thứ của theme cha và update phiên bản mới nếu có.
• Nếu muốn chỉnh sửa 1 tập tin nào đó thì bạn copy file đó từ Theme cha sang Child Theme để chỉnh sửa.
• Không được sao chép file functions.php từ thư mục theme cha sang Child Theme. Điều này sẽ gây ra lỗi làm theme không hoạt động.
• Ngoại trừ file functions.php, các file còn lại bạn đều có thể copy từ theme cha sang child Theme để sửa đổi và thiết kế theo ý thích.

Việc tạo child theme WordPress rất nhanh chóng và dễ dàng để bạn có thể tùy biến code thoải mái mà không phải lo lắng mỗi khi theme nâng cấp phiên bản mới.

Ngoài việc cài đặt child theme là rất cần thiết thì còn nhiều việc khác cũng quan trọng không kém. Hãy tham khảo Những việc quan trọng cần làm ngay sau khi cài đặt WordPress cho website.

Thông qua bài viết này, hy vọng bạn đã hiểu đươc Child theme là gì? Và cũng đã biết 2 cách tạo child theme WordPress, bạn thích cách nào hơn? Mời bạn để lại bình luận cùng chia sẻ với MMO Nào nhé.

Chúc các bạn thành công!