Tìm hiểu về Child theme trong Wordpress

Thảo luận trong 'Hướng dẫn' bắt đầu bởi TechBuba, 4/10/15.

  1. TechBuba Nhà Báo (Báo Đời)

    Child theme trong wordpress là theme được kế thừa các chức năng và các thuộc tính của một theme khác và theme khác đó được gọi là theme cha. Child theme cho phép bạn chỉnh sửa hoặc thêm một chức năng nào đó vào theme cha.

    Child theme trong wordpress là theme được kế thừa các chức năng và các thuộc tính của một theme khác và theme khác đó được gọi là parent theme. Child theme cho phép bạn chỉnh sửa hoặc thêm một chức năng nào đó vào parent theme.

    Khi bạn tạo một child theme, thì nếu bạn copy một file nào đó ở thư mục theme parent qua bên thư mục của child theme thì nó sẽ tiến hành thực thi file đó ở thư mục child theme, nếu thư mục child theme thiếu file nào thì nó sẽ thực thi file bên thư mục parent theme.

    Ví dụ, thư mục child theme của mình chỉ có mỗi file style.css, thì lúc đó ngoại trừ file style.css, các file khác đều thực thi từ thư mục theme parent. Nếu copy file single.php từ thư mục parent theme sang child theme thì nó sẽ ưu tiên thực thi file single.php ở thư mục child theme, còn các file khác nó vẫn thực thi ở thư mục parent theme.

    Riêng file functions.php của parent theme parent sẽ không bị thay đổi dù bạn có khai báo thêm file functions.php trong thư mục child theme, mà các code bên trong file functions.php của child theme sẽ tiến hành load thêm song hành với các code bên trong file functions.php của parent theme.

    Do đó bạn có thể hiểu rằng, khi sử dụng child theme mà muốn tùy biến file nào thì chỉ cần copy file đó qua thư mục child theme và tiến hành chỉnh sửa nó, không cần đụng chạm gì tới parent theme.

    Cách tạo child theme
    Tạo 1 folder làm child theme nằm cùng vị trí với parent theme. Mở style.css của child theme, và điền nội dung sau:
    PHP:
    /*  Theme Name:     Child theme name 
    Theme URI:      http://example.com/twenty-thirteen-child/ 
    Description:    child theme description 
    Author:         Sample Author 
    Author URI:     http://www.example.com 
    Template:       twentythirteen         //not allow space, folder of parent theme 
    Version:        1.0.0 */ 
    @import url("../twentythirteen/style.css");
    /* Theme customization starts here -------------------------------------------------------------- */
    Dòng “Template” bạn khai báo tên theme làm parent theme, child theme sẽ kế thừa parent theme này. Lưu ý: tên theme thì không viết cách (folder name of parent theme). Tên theme có thể sử dụng ký tự hyphen “-”, ie: example-theme-name

    Dòng @import url để kế thừa css từ parent theme, nhập địa chỉ style.css tương ứng đến parent theme. Ok đã tạo xong child theme, để kích hoạt child theme vào Appreance->themes và kích hoạt theme vừa tạo.

    Template Files:
    Child theme sẽ kế thừa functions.php và các template khác như header.php, footer.php.. từ parent theme, nếu không muốn dùng template cùa parent theme thì tạo mới tương ứng trong child theme. Ví dụ: mình tạo mới header.php thì tạo file child-theme/header.php như vậy khi chạy website theme sẽ sử dụng header.php trong child theme.

    Tính năng override template files ở child theme sẽ không đúng với functions.php, đây là file chứa toàn bộ code sử lý cho theme. Child theme sẽ nạp cả child-theme/functions.php và parent-theme/functions.php và nên cẩn trọng khi định nghĩa hàm trong 2 file này. Chú ý: functions.php trong child theme sẽ nạp trước.

    Vì lý do này, bạn cần kiểm tra xem hàm định nghĩa trong parent theme functions.php có tạo trước đó trong child theme functions.php không và có thể thay thế hàm PHP trong parent theme:
    PHP:
    #your-parent-theme/functions.php if ( ! function_exists( 'your_function' ) ) {     function your_function() {         //  Do something.     } }
    Including Files trong Child Theme:
    Điểm lưu ý khi dùng child theme, thông thường để include file bạn dung:
    PHP:
    include_once(get_template_directory().'/my_included_file.php');
    get_template_directory(): trả về đường dẫn tới parent theme. Trong trường hợp này phải dùng hàm get_stylesheet_directory sẽ trả về đướng dẫn folder tới child theme.
    PHP:
    get_stylesheet_directory();
    Tham khảo chi tiết tại link sau:
    http://codex.wordpress.org/Child_Themes
     
     
  2. Bình Luận Bằng Facebook