Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress

Hướng dẫn tạo child theme trong WordPress một cách đơn giản.

Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress

Trong WordPress, child theme (hay “theme con”) thường được tạo ra với mục đích lưu trữ những thiết lập và tùy biến của người dùng (chẳng hạn như các đoạn code snippets trong functions.php hay các đoạn CSS trong style.css), hoạt động dựa trên nền tảng của theme gốc (parent theme). Khi update theme gốc lên phiên bản mới hơn, child theme sẽ hoàn toàn không bị ảnh hưởng, do đó, người dùng vẫn giữ lại được những tùy biến của mình. Nếu bạn đang muốn cá nhân hóa giao diện hiện tại thì hãy nhanh chóng tạo cho nó một child theme nhé.

Tham khảo thêm:

  • Top 5 plugin miễn phí giúp chỉnh sửa CSS trong WordPress
  • Tạo file functions.php để chèn code tùy biến WordPress

Đối với những người không thông thạo code, việc tạo child theme theo phương pháp thủ công thực sự rất khó khăn và tốn nhiều công sức. Tuy nhiên, đừng lo lắng, bởi vì ngay bây giờ, tôi sẽ hướng dẫn cho các bạn cách tạo child theme hoàn chỉnh chỉ trong vài click chuột.

1. Việc đầu tiên các bạn cần làm chính là cài đặt và kích hoạt plugin Child Theme Generator (download).

Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress

2. Tiếp theo, truy cập vào Settings => Child-Theme Gen. Các bạn sẽ thấy giao diện như sau:

Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress

Trong đó:

  • Parent theme: lựa chọn theme gốc mà bạn muốn tạo child theme.
  • Heading: đặt tên cho child theme. Chẳng hạn, tôi đang dùng parent theme là PublishNow Pro, tôi sẽ đặt tên cho child theme của nó là “PublishNow Pro Child”.
  • Description: viết mô tả cho child theme, tốt nhất các bạn nên viết bằng tiếng Anh hoặc tiếng Việt không dấu.
  • Child Theme URL: link tới trang giới thiệu về child theme.
  • Author: tên tác giả của child theme.
  • Author URL: link tới trang giới thiệu tác giả của child theme.
  • Version: phiên bản của child theme.
  • Include GPL License: bao gồm cả giấy phép GPL.

Sau khi hoàn tất, click vào nút Create new child theme.

3. Gần như ngay lập tức, một child theme sẽ tự động được tạo ra. Nếu bạn muốn kích hoạt luôn child theme này, hãy tick vào mục Activate child-theme rồi click nút Finished.

Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress

4. Việc còn lại của bạn là truy cập Appearance => Themes và tiến hành tùy biến child theme mà thôi. Thật đơn giản phải không nào?

Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress

Lưu ý:

  • Sau khi tạo child theme, các bạn có thể vô hiệu hóa và xóa plugin Child Theme Generator nếu không còn dùng đến nữa.
  • Một số plugin đi kèm parent theme sẽ bị vô hiệu hóa khi child theme được tạo. Các bạn cần truy cập mục Plugins và kích hoạt lại chúng.

Bạn đang sử dụng phương pháp nào để tạo child theme trong WordPress? Hãy chia sẻ nó với chúng tôi bằng cách sử dụng khung bình luận bên dưới.

Nếu bạn thích bài viết này, hãy subscribe blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất qua email nhé. Cảm ơn rất nhiều. :)

Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress

Một người con của xứ Nghệ, hiện đang sinh sống tại Hà Nội. Theo dõi tôi trên Facebook để cập nhật những tin tức mới nhất liên quan đến WordPress nhé.

Reader Interactions

Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress

Đã đăng vào thg 12 23, 2017 10:11 SA 3 phút đọc 3 phút đọc

Nếu bạn đã từng sử dụng WordPress để xây dựng các website thì việc biết đến và sử dụng Child Theme là hết sức cần thiết. Child Theme là một theme con được tạo ra và được kế thừa toàn bộ các đặc điểm, chức năng của theme cha (Parent Theme).

  1. Tại sao nên sử dụng Child Theme Trong quá trình sử dụng theme WordPress khi bạn muốn chỉnh sửa, thay đổi các chức năng để phù hợp với yêu cầu công việc là tất yếu. Tuy nhiên những chỉnh sửa này có thể sẽ mất nếu bạn sửa trực tiếp và khi theme update. Việc khôi phục và gỡ lỗi là khá khó khăn. Mục đích của việc sử dụng Child Theme là giúp bạn chỉnh sửa theme theo ý muốn mà không mất các tuỳ biến này khi theme được cập nhật.
  2. Child Theme hoạt động như thế nào?
  • Khi bạn sử dụng child theme bạn cần tạo cấu trúc thư mục và file tương tự như ở Parent Theme. Dựa trên cấu trúc đó, khi bạn sử dụng child theme thì các file trong thư mục child theme sẽ được thực thi. Nếu thư mục child theme không có file đó thì file bên parent Theme sẽ được thực thi.
  • Chú ý: file style.css và file functions.php sẽ được thực thi song song, có nghĩa là muốn viết thêm các function bạn có thể viết trong child theme.
  1. Cách tạo child theme Ví dụ: Chúng ta có 1 theme wordpress là haru-circle và chúng ta cần tạo 1 child theme là haru-circle-child. Cấu trúc file như sau:
    Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress
  • functions.php: có thể viết thêm các hàm php phục vụ cho chức năng của site
  • style.css: viết thêm custom css code
  • templates folder: tuỳ từng theme sẽ có thư mục này hay không, đây là các templates hiển thị của WordPress (copy tương ứng từ Parent Theme sang child theme theo cấu trúc thư mục) Chi tiết code file style.css
/*
Theme Name: Haru Circle - Child
Theme URI: http://harutheme.com/circle
Author: HaruTheme
Author URI: http://harutheme.com/
Description: This is child theme of Haru Circle
Template: haru-circle
Version: 1.0.0

*/

/*---------------------------------
    Write your css code from here
------------------------------------*/

Chi tiết file functions.php


Tuỳ theo khai báo file style.css trong parent theme bạn sẽ cần thay đổi: haru-theme-style (đây là khai báo của file style.css trong parent theme) Ví dụ code trong parent theme Copy tương ứng và chỉnh sửa trong child theme Hiển thị đã được thay đổi khi sửa trong child theme Chú ý để sử dụng child theme bạn cần active trong Apprearance -> Themes Qua bài viết chia sẻ về cách sử dụng Child Theme hy vọng sẽ giúp các bạn đang và sẽ sử dụng WordPress có thể áp dụng và tuỳ biến theme để phù hợp với công việc của mình và tránh các mất mát khi đã chỉnh sửa.haru-theme-style (đây là khai báo của file style.css trong parent theme) Ví dụ code trong parent theme

Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress
Copy tương ứng và chỉnh sửa trong child theme
Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress
Hiển thị đã được thay đổi khi sửa trong child theme
Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress
Chú ý để sử dụng child theme bạn cần active trong Apprearance -> Themes
Hướng dẫn wordpress child theme generator - trình tạo chủ đề con wordpress
Qua bài viết chia sẻ về cách sử dụng Child Theme hy vọng sẽ giúp các bạn đang và sẽ sử dụng WordPress có thể áp dụng và tuỳ biến theme để phù hợp với công việc của mình và tránh các mất mát khi đã chỉnh sửa.

All rights reserved