What is: Hooks

ในการพัฒนาธีมหรือสร้างปลั๊กอิน หากเราต้องการ “เพิ่มข้อมูล” หรือ “เปลี่ยนแปลงข้อมูล” ต่างๆ เราจะไม่แก้ที่โค้ดของเวิร์ดเพรสโดยตรง แต่จะทำผ่าน “จุด/เงื่อนไข” ต่างๆ ที่เวิร์ดเพรสวางไว้ให้ เช่น ณ จุดที่จะแสดงหัวเรื่อง, ณ จุดที่จะแสดงเนื้อหา ฯลฯ

จุด/เงื่อนไข ต่างๆ เหล่านี้ เวิร์ดเพรสเรียกว่า Hooks ซึ่งหมายถึงตะขอ ให้เราเกี่ยว/แทรกโค้ดไปได้

แทรกโค้ด?

การแทรกโค้ด จะมี 2 แบบคือ Action และ Filter

Action แปลว่า กระทำ/จัดการ ให้เราสามารถแทรกข้อมูลเพิ่ม โดยไม่ได้เปลี่ยนแปลงข้อมูลเดิม

Filters แปลว่า กรอง นั่นคือ เอาข้อมูลเดิมมา แล้วเปลี่ยนแปลงมันก่อน ค่อยส่งออกไป

ตัวอย่างการ Hooks โดยใช้ Action  ในเวิร์ดเพรส

function nann_enqueue_script() {
  wp_enqueue_script( 'nann-custom-js', 'nann-custom.js', false );
}
add_action( 'wp_enqueue_scripts', 'nann_enqueue_script' );

อันดับแรก เราสร้าง function ก่อน โดยฟังก์ชั่นนี้จะทำการเพิ่มโค้ด js เข้าไปด้วยคำสั่ง enqueue script (แปลว่า เอาสคริปท์ ไป ต่อคิว) – ที่เวิร์ดเพรสไม่ให้เราเอา js ใส่ตรงๆ เพราะอาจจะมีปลั๊กอินอื่นๆ มาจัดการมันอีกต่อได้ เช่น ไปบีบอัด, ทำเป็นแคช, ย้ายจาก header ไป footer ฯลฯ

ต่อมา add_action คือการบอกว่า ณ จุด wp_enqueue_scripts ให้เรียกฟังก์ชั่นนี้ไปใช้ด้วยนะ

ตัวอย่างการ Hooks โดยใช้ Filter ในเวิร์ดเพรส

function nann_custom_excerpt( $output ) {
  return 'บทเกริ่นนำ: '.$output;
}
add_filter( 'get_the_excerpt', 'nann_custom_excerpt' );

อันดับแรกคือ สร้าง function ที่เพิ่มคำว่า “บทเกริ่นนำ: ” นำหน้าข้อความที่ได้รับ

ต่อมา add_filter คือการบอกว่า เมื่อไหร่ที่มีคนเรียกคำสั่ง get_the_excerpt ให้เอาข้อความมาแปลงก่อน (ใส่คำว่า “บทเกริ่นนำ”) แล้วค่อยส่งต่อ

สรุป

เวิร์ดเพรสเป็นระบบที่เปิดให้เราเขียนปลั๊กอินเข้าไปแทรกในจุดต่างๆ ได้ ไม่ว่าจะแทรกเพื่อ “เพิ่ม” หรือแทรกเพื่อ “เปลี่ยน” ข้อมูล หากเรารู้ว่ามีจุดอะไรให้แทรกบ้าง เราก็สามารถต่อยอดเวิร์ดเพรส ไปเป็นระบบที่เราต้องการได้

อ้างอิง

บทความนี้ร่วมเขียนโดย แนน และ เม่น แห่ง SeedThemes


หมายเหตุ: คำถามผ่านเฟซบุคอาจมีการตกหล่น แนะนำให้ติดต่อผ่าน อินบ๊อกซ์ หรือ เว็บบอร์ด นะครับ