Tạo Child Theme Trong WordPress

Child Theme trong WordPress là một cách an toàn và hiệu quả để tùy chỉnh giao diện của website mà không làm thay đổi trực tiếp theme gốc (Parent Theme). Điều này giúp bạn bảo vệ các chỉnh sửa khỏi bị ghi đè khi theme gốc được cập nhật. Bài viết này sẽ hướng dẫn chi tiết cách tạo Child Theme trong WordPress, từ bước chuẩn bị đến cấu hình và kích hoạt.

Child Theme

1. Child Theme là gì và tại sao cần tạo Child Theme trong WordPress?

Child Theme là gì?

Child Theme là một theme riêng biệt, thừa hưởng toàn bộ tính năng và phong cách của theme gốc (Parent Theme). Bất kỳ thay đổi nào bạn thực hiện trên Child Theme sẽ không ảnh hưởng đến theme gốc.

Lợi ích của việc tạo Child Theme trong WordPress

Bảo toàn tùy chỉnh: Các thay đổi không bị mất khi cập nhật theme gốc.
Dễ quản lý: Chỉ cần chỉnh sửa các file trong Child Theme để tùy chỉnh giao diện hoặc chức năng.

An toàn: Dễ dàng quay lại theme gốc nếu xảy ra lỗi.

2. Chuẩn bị trước khi tạo Child Theme trong WordPress

Kiểm tra Parent Theme khi tạo Child Theme trong WordPress

Xác định theme gốc mà bạn muốn tạo Child Theme trong WordPress.
Truy cập Appearance > Themes (Giao diện > Giao diện) để kiểm tra tên theme đang sử dụng.

Công cụ cần thiết để tạo Child Theme trong WordPress

Trình quản lý file: File Manager của hosting hoặc phần mềm FTP như FileZilla.

Trình chỉnh sửa mã: Sử dụng trình chỉnh sửa văn bản như Notepad++, Visual Studio Code, hoặc trình chỉnh sửa tích hợp trong WordPress.

3. Cách tạo Child Theme trong WordPress

Bước 1: Tạo thư mục Child Theme

Truy cập thư mục cài đặt WordPress của bạn qua File Manager hoặc FTP.
Điều hướng đến thư mục: wp-content/themes.
Tạo một thư mục mới cho Child Theme.
- Đặt tên thư mục theo định dạng: [tên-theme-gốc]-child.
- Ví dụ: Nếu theme gốc là twentytwentythree, thư mục có thể là twentytwentythree-child.

Bước 2: Tạo file style.css

Trong thư mục Child Theme vừa tạo, tạo file mới có tên style.css.
Mở file style.css và thêm nội dung sau:

Theme Name: Twenty Twenty-Three Child

Template: twentytwentythree

Version: 1.0

Author: Your Name

Description: A Child Theme for Twenty Twenty-Three theme

Theme Name: Tên của Child Theme (bắt buộc).
Template: Tên thư mục của Parent Theme (bắt buộc, phải chính xác).
Version: Phiên bản của Child Theme (tuỳ chọn).
Author: Tên của bạn (tuỳ chọn).
Description: Mô tả ngắn về Child Theme (tuỳ chọn) khi tạo Child Theme trong WordPress.

Bước 3: Tạo file functions.php

Tạo file mới trong thư mục Child Theme có tên functions.php.
Mở file và thêm đoạn mã sau để kế thừa file CSS của Parent Theme:
<?php

function child_theme_enqueue_styles() {

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

wp_enqueue_style(‘child-style’, get_stylesheet_directory_uri() . ‘/style.css’, array(‘parent-style’));

}

add_action(‘wp_enqueue_scripts’, ‘child_theme_enqueue_styles’);

Bước 4: Kích hoạt Child Theme

Truy cập Appearance > Themes (Giao diện > Giao diện).
Tìm Child Theme vừa tạo trong danh sách theme.

Nhấn Activate (Kích hoạt) để sử dụng khi tạo Child Theme trong WordPress.

4. Tạo Child Theme trong WordPress: Tùy chỉnh Child Theme

Thêm mã CSS tùy chỉnh

Thêm các đoạn mã CSS vào file style.css của Child Theme để thay đổi giao diện.

Ghi đè template file của Parent Theme

Sao chép bất kỳ file template nào từ Parent Theme (ví dụ: header.php, footer.php) vào thư mục Child Theme.
Chỉnh sửa file trong Child Theme mà không ảnh hưởng đến theme gốc.

Thêm tính năng mới khi tạo Child Theme trong WordPress

Thêm mã PHP tùy chỉnh vào file functions.php của Child Theme để thêm hoặc sửa đổi chức năng.

5. Tạo Child Theme trong WordPress: Kiểm tra và xử lý lỗi thường gặp

Kiểm tra xem Child Theme có hoạt động hay không

Truy cập website và kiểm tra xem giao diện có thay đổi không.
Nếu có lỗi, hãy kiểm tra:
- Đường dẫn Template trong file style.css.
- Lỗi cú pháp trong file functions.php.

Xử lý lỗi phổ biến khi tạo Child Theme trong WordPress

Giao diện không hiển thị đúng: Đảm bảo file functions.php đã kế thừa đúng file CSS của Parent Theme.

Trang trống hoặc lỗi 500: Kiểm tra lại cú pháp PHP trong file functions.php.

6. Tạo Child Theme trong WordPress: Mẹo sử dụng Child Theme hiệu quả

Sao lưu trước khi thay đổi: Trước khi chỉnh sửa, hãy sao lưu các file quan trọng.
Chỉ sửa file cần thiết: Không sao chép toàn bộ file của Parent Theme, chỉ sao chép file cần chỉnh sửa khi tạo Child Theme trong WordPress.
Kiểm tra trên môi trường staging: Thử nghiệm các thay đổi trên một môi trường staging trước khi áp dụng trên website chính.
Tối ưu mã: Giữ mã CSS và PHP gọn gàng, dễ đọc khi tạo Child Theme trong WordPress.

Tạo Child Theme trong WordPress là phương pháp hiệu quả để tùy chỉnh giao diện mà vẫn giữ được tính an toàn khi cập nhật theme gốc. Với các bước đơn giản trên, bạn có thể dễ dàng tạo Child Theme trong WordPress và quản lý theo cách riêng của mình. Bắt đầu ngay hôm nay để xây dựng một website WordPress độc đáo và chuyên nghiệp hơn!

Liên hệ Zalo 036 897 1050 của công ty ”Thiết Kế Web Chuyên” và ThietKeWebWio để “thiết kế logo giá rẻ” và vẽ logo chibi tại TpHCM -> Hà Nội