Hướng dẫn tạo child theme trong wordpress

Chào các bạn, hôm nay mình hướng dẫn đến các bạn một bài viết củng khá quan trọng trong wordpress. Như các bạn đã biết trong wordpress theme thì nó chỉ có một theme chính thôi, nhưng bạn muốn tùy biến giao diện hay viết css cho những thứ bạn muốn, thì các bạn phải viết đè lên lên theme chính đó luôn. Việc viết đè trực tiếp lên theme chính đó thì nhanh nhưng không thực sự hiệu quả và lở sau này bạn muốn cập nhật version của theme lên bản mới nhất thì những đoạn code css hay những phần mà bạn tùy biến sẽ mất hết toàn bộ. Nên hôm nay bài viết này ra đời đó là Tạo child theme trong wordpress. Let go…….)))

Khi bạn sử dụng child theme thì các file trong thư mục childt heme sẽ thực thi, nếu nhưng ở child theme không có các file đó thì nó sẽ thực thi ở theme mẹ( parent theme ).

Hôm nay mình sẽ lấy ví dụ về theme Divi , đây là theme mẹ và bạn muốn tạo child theme để kế thừa lại các file của theme cha thì bạn sẽ tạo như sau:

Childtheme đầy đủ cần có hai file quan trọng đó là file style.cssfunctions.php. Nếu bạn không biết hai file này như thế nào thì có thể tìm hiểu bài này nha.

1. Tạo file style.css

/* Theme Name: Divi Child 
Theme URI: http://www.elegantthemes.com/gallery/divi/ 
Template: Divi 
Author: Elegant 
Themes Author URI: http://www.elegantthemes.com 
Description: Smart. Flexible. Beautiful. Divi is the most powerful theme in our collection. 
Tags: responsive-layout,one-column,two-columns,three-columns,four-columns,left-sidebar,right-sidebar,custom-background,custom-colors,featured-images,full-width-template,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready Version: 1.0 
*/

Mình sẽ giải thích sơ qua các phần:

  • Theme Name: Là tên mình muốn đặt cho Child theme, bạn đặt tên gì củng được miễn nó giống với theme mẹ cho đẹp và thêm phái sau chữ Child.
  • Theme Uri: Là url của theme, có củng được, không có củng không sao.
  • Template: Cực kì quan trọng, bạn phải gõ đúng tên theme mẹ.
  • Author: Tên tác giả của theme
  • Description: Mô tả cho theme
  • Tags: Mô tả các thẻ cho theme
  • Version: Phiên bản đầu tiên tạo, mình sẽ để bản đầu tiên là 1.0.0

Sau khi khai báo các mục trong file style.css xong thì bạn tạo cho mình file functions.php nha. Tiếp đến bạn đăng nhập vào admin wordpress, domain/wp-admin -> Giao diện rồi Active child theme lên.

Sau khi Active theme xong thì bạn có thể tùy biến tùy ý rồi. Và sau này có update theme chính thì củng không sợ mất code của bạn.

2. Tạo file functions.php

Tiếp theo bạn tạo file functions.php để khi báo các phần cần thiết.

define('ROOT_CHILD_URI', get_stylesheet_directory_uri());
define('ROOT_CHILD_DIR', get_stylesheet_directory());

Bạn khai báo hai hàm này vào. Tiếp bạn khai báo hàm này để nó nhận css từ theme mẹ nha.

<?php
 add_action( 'wp_enqueue_scripts', 'enqueue_child_theme_styles');
  function enqueue_child_theme_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
  }
?>

Vậy là nó đã hoàn chỉnh về việc tạo child theme trong wordpress rồi. Từ đó bạn có thể tạo thêm các file bạn càn giải quyết cho website của mình ví dụ như bạn muốn sửa file single.php thì bạn chỉ cần tạo file single.php ở child theme thì bạn có thể tùy biến thoải mái rồi nha.

3. Những điêu lưu ý khi tạo child theme

  • Không được xóa thư mục mẹ
  • Mún sửa file nào thì copy file đó ở theme mẹ rồi bỏ qua theme con để sửa.

4. Tổng kết

Hi vọng qua bài viết này các bạn có thể hiểu và tạo cho mình được child theme để dể dàng tùy biến, chúc các bạn thành công. Good luck !!!