การใช้งานธีมลูก (Child Theme) ตอนที่ 2

การใช้งานธีมลูกนั้น เราสามารถแก้ไข theme wordpress ได้ใน 3 ลักษณะด้วยกัน ได้แก่

• การแก้ไขไฟล์ style.css
• การแก้ไขไฟล์หลัก เช่น header.php, footer.php ต่างๆ
• การแก้ไขไฟล์ functions.php

อันดับแรกการแก้ไขไฟล์ style.css จากบทความที่แล้ว เมื่อเราทำการแนะนำให้ธีมลูก (Child Theme) ของเราได้รู้จักกับไฟล์ style.css ของธีมหลัก (Parent Theme) แล้ว เราก็สามารถแก้ไขไฟล์ดังกล่าวในธีมลูกได้เป็นปกติ เหมือนกันกับการเขียน CSS บนธีมหลัก (Parent Theme) ได้ทันทีเนื่องจากเมื่อเวลาเวิร์ดเพรส (WordPress) อ่านค่าจะทำการใช้ค่าไฟล์ที่ธีมลูกก่อนทุกครั้งแล้วค่อยไปอ่านธีมหลัก
ในขั้นตอนถัดมาการแก้ไขไฟล์หลัก นั้น เราสามารถสร้างไฟล์เหล่านี้ใหม่โดยให้อยู่ในโฟลเดอร์ของธีมลูกได้ กล่าวคือ ในธีมหลัก (Parent Theme) มีไฟล์ header.php ในธีมลูกก็จะต้องมีไฟล์นี้เช่นเดียวกัน หากเราต้องการแก้ไขในบางส่วนของไฟล์ แนะนำให้ก๊อบปี้จากไฟล์หลักมาใส่แล้วทำการแก้ไขนะจุดนั้นๆ เพียงเท่านี้เราก็จะได้หน้าตาของเวบไซต์เปลี่ยนไปตามที่เราต้องการ

ตัวอย่าง
ธีมหลัก มีไฟล์ stye.css, functions.php, header.php
ธีมลูก ก็ให้มีไฟล์แบบเดียวกัน คือ style.css, functions.php และ header.php เมื่อเราต้องการที่จะแก้ header.php ในธีมหลัก ให้เราแก้ที่ header.php ที่ธีมลูก

การแก้ไขไฟล์ฟังก์ชั่น functions.php

ส่วนที่ยากที่สุดในการแก้ไข theme wordpress คือ การแก้ไขฟังก์ชั่น functions.php นั้น ในไฟล์ฟังก์ชั่นนั้นเราจะต้องทำการแก้ไขด้วยการนำออก (Remove) เมื่อเราไม่ต้องการใช้ฟังก์ชั่นนั้นๆ และนำเข้า (Add) เมื่อเราต้องการใช้งานทุกครั้ง ในไฟล์ functions.php เราสามารถแก้ไขข้อมูลดังต่อไปนี้

1. 1. ฟีเจอร์ของธีม (Theme features) เช่น กลุ่มฟังก์ชั่น add_theme_support() เช่น
      • post-formats
      • post-thumbnails
      • custom-background
      • custom-header
      • automatic-feed-links

      เราสามารถยกเลิกได้ด้วยการใช้ฟังก์ชั่น remove_theme_support() ตามด้านล่าง

      Remove Theme Support

      function remove_parent_theme_features() { remove_theme_support( 'post-formats' ); remove_theme_support( 'post-thumbnails' ); remove_theme_support( 'custom-background' ); remove_theme_support( 'custom-header' ); remove_theme_support( 'automatic-feed-links' ); }

      1 2 3 4 5 6 7

      function remove_parent_theme_features() {     remove_theme_support( 'post-formats' );     remove_theme_support( 'post-thumbnails' );     remove_theme_support( 'custom-background' );     remove_theme_support( 'custom-header' );     remove_theme_support( 'automatic-feed-links' ); }

   2. ประเภทของบทความพิเศษและกลุ่มบทความพิเศษ (Custom Post Types and Taxonomies) เราสามารถเอาประเภทบทความพิเศษนี้ออกได้ด้วยการนำออก (Remove) โดยใช้ฟังก์ชั่น remove_action() และเรายังสามารถเพิ่มบทความพิเศษเข้าไปได้ด้วยฟังก์ชั่น add_action() เช่นเดียวกันจากตัวอย่างด้านล่างจะเป็นการลงทะเบียนประเภทของบทความพิเศษ (Custom Post Types) ในธีมหลัก (Parent Theme)
      Register Parent Post Type

      // PARENT functions.php add_action( 'after_setup_theme', 'parent_movie_add_post_type' ); function parent_movie_add_post_type() { $parent_args = array( // other arguments... 'rewrite' => array( 'slug' => 'movie' ), 'supports' => array( 'title', 'editor', 'author', 'excerpt' ) ); register_post_type( 'movie', $parent_args ); }

      1 2 3 4 5 6 7 8 9 10 11 12 13

      // PARENT functions.php add_action( 'after_setup_theme', 'parent_movie_add_post_type' ); function parent_movie_add_post_type() {     $parent_args = array(         // other arguments...         'rewrite' => array( 'slug' => 'movie' ),         'supports' => array( 'title', 'editor', 'author', 'excerpt' )     );     register_post_type( 'movie', $parent_args ); }

      หากเราไม่ต้องการใช้งานประเภทของบทความพิเศษนั้น ตามตัวอย่างด้านล่าง

      Remove Parent Post Type and Add Child Post Type

      // CHILD functions.php function remove_parent_theme_features() { // remove Movie Custom Post Type remove_action( 'init', 'parent_movie_add_post_type' ); /* alternatively, we can add our custom post type to overwrite only some aspects of the parent function */ add_action( 'init', 'child_movie_post_type' ); } function child_movie_post_type() { $child_args = array( // other arguments... // change Custom Post slug 'rewrite' => array( 'slug' => 'child-movie' ), // remove excerpts and add post thumbs 'supports' => array( 'title', 'editor', 'author', 'thumbnail' ) ); register_post_type( 'movie', $child_args ); }

      1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

      // CHILD functions.php function remove_parent_theme_features() {     // remove Movie Custom Post Type     remove_action( 'init', 'parent_movie_add_post_type' );     /*     alternatively, we can add our custom post type to     overwrite only some aspects of the parent function     */     add_action( 'init', 'child_movie_post_type' ); } function child_movie_post_type() {     $child_args = array(         // other arguments...         // change Custom Post slug         'rewrite' => array( 'slug' => 'child-movie' ),         // remove excerpts and add post thumbs         'supports' => array( 'title', 'editor', 'author', 'thumbnail' )     );     register_post_type( 'movie', $child_args ); }

      นอกจากที่เราจะนำออก (Remove) ประเภทของบทความพิเศษได้ทั้งหมดแล้ว เรายังสามารถเอาฟีเจอร์เฉพาะบางอย่างออกโดยไม่จำเป็นต้องนำประเภทของบทความพิเศษออกทั้งหมดก็ได้ จากตัวอย่างจะเห็นว่าเราจะนำเฉพาะฟีเจอร์สิ่งที่คัดตอนมา (Excerpt) ออก แล้วนำฟีเจอร์รูปภาพขนาดเล็ก (Thumbnail) ใส่เข้าไปแทนได้ โดยการใช้ฟังก์ชั่น remove_post_type_support() และ add_post_type_support() ตามลำดับ

      Remove some features in custom post type

      function remove_parent_theme_features() { add_action( 'init', 'wp_tuts_remove_post_feature' ); } function wp_tuts_remove_post_feature() { // remove excerpt remove_post_type_support( 'movie', 'excerpt' ); // add post thumbs add_post_type_support( 'movie', 'thumbnail' ); }

      1 2 3 4 5 6 7 8 9 10

      function remove_parent_theme_features() {     add_action( 'init', 'wp_tuts_remove_post_feature' ); } function wp_tuts_remove_post_feature() {     // remove excerpt     remove_post_type_support( 'movie', 'excerpt' );     // add post thumbs     add_post_type_support( 'movie', 'thumbnail' ); }

      ในส่วนของ Taxonomy ก็เช่นเดียวกัน เราสามารถนำออก (Remove) ได้ด้วยฟังก์ชั่น remove_action() ไปที่ฟังก์ชั่น parent_taxonomy()

      Remove Taxonomy

      function wp_tuts_after_setup_theme() { remove_action( 'init', 'parent_taxonomy' ); }

      1 2 3

      function wp_tuts_after_setup_theme() {     remove_action( 'init', 'parent_taxonomy' ); }

สำหรับเนื้อหาในส่วนของการใช้งานธีมลูก เราจะเขียนต่อในบทต่อไปนะครับ

 

หมายเหตุ หากต้องการเรียนผ่านคอร์สออนไลน์ สามารถดูได้ที่คอร์ส โมดิฟาย WordPress Theme อย่างไรให้ตรงใจลูกค้า

อ้างอิงเอกสาร How to modify the parent theme behavior within the child theme