WordPress hooks คืออะไร? ในวงการเว็บไซต์ พูดได้ว่า WordPress เป็นหนึ่งในระบบ Content Management (CMS) ที่ได้รับความนิยมสูง ซึ่งมี Market Share มากกว่า 60% ทั่วโลก เหตุผลหนึ่งอาจเป็นเพราะจำนวน Plugin แบบไม่เสียค่าใช้จ่ายที่มีให้เลือกใช้งานจำนวนมาก อย่างไรก็ตาม Plugin เหล่านี้อาจทำให้คะแนน Core Web Vitals ลดลง ดังนั้น WordPress Hooks จึงเข้ามามีบทบาทในการทำ SEO กับเว็บไซต์ที่ใช้ WordPress มากขึ้น
Plugin จาก WordPress ส่งผลต่อ SEO อย่างไร?
แม้ WordPress จะมี Plugin ฟรีจำนวนมากให้เลือกใช้ อีกทั้งมีคอมมูนิตี้ช่วยสนับสนุน ทั้งนี้การติดตั้ง Plugin ก็มีข้อเสียที่มองข้ามไปไม่ได้ คือ คะแนน Core Web Vitals ที่ลดลง เพราะจำนวน Plugin อาจใส่ CSS หรือ JS File บนหน้าเว็บไซต์มากขึ้นโดยไม่จำเป็น ส่งผลให้เว็บไซต์ช้าลง และมีคะแนน Core Web Vitals ลดลงในที่สุด
เพื่อจะแก้ปัญหาดังกล่าว หลายธุรกิจอาจจ้างโปรแกรมเมอร์เข้ามาจัดการเว็บไซต์ เลือกซื้อ Plugin แบบ Premium อาจเขียนโค้ดขึ้นมาเอง (Custom Coding) หรือลงทุนทำ Technical SEO เอง ซึ่งอาจส่งผลให้เสียทั้งเวลาและงบประมาณมากขึ้น
WordPress Hooks คืออะไร?
WordPress Hooks เป็นหนึ่งในฟีเจอร์ของ WordPress ที่ช่วยให้นักพัฒนาสามารถเพิ่มหรือแก้ไขฟังก์ชันการทำงานของ WordPress ได้โดยไม่ต้องแก้ไขไฟล์หลักของเว็บไซต์ (Core WP Files) ซึ่งเป็นวิธีที่ปลอดภัยและมีประสิทธิภาพในการปรับแต่งเว็บไซต์ WordPress เช่น อัปเดตธีม หรือติดตั้ง Plugin เพิ่มเติมโดยไม่ส่งผลต่อการปรับแต่งใดๆ
โดย Hooks แบ่งออกเป็น 2 ประเภทหลัก คือ
1. Filter Hook
เป็น Hook ที่มีฟังก์ชันในการแก้ไขหรือกรองข้อมูลก่อนที่จะแสดงผลหรือบันทึกลงฐานข้อมูล เช่น การใช้ wp_title ในการตั้ง Suffix Page Title สำหรับหน้าบทความ
2. Action Hook
Hook ที่ใช้สำหรับเพิ่มหรือแทรกโค้ดเพื่อกำหนด Action ในจุดที่กำหนดใน WP Core, Plugin หรือ Theme เช่น เมื่อเรา Publish บทความ หรือโหลดไฟล์ JS และ CSS เป็นต้น
พูดได้ว่าการใช้งาน WordPress Hooks นี้จะช่วยให้เราสามารถปรับแต่งเว็บไซต์และทำ Technical SEO ได้อย่างยืดหยุ่น โดยไม่ต้องพึ่งพา Plugin จำนวนมากเกินไป
ทำไมต้องใช้ WordPress hooks สำหรับ Technical SEO?
การทำ Technical SEO คืออะไร? หลายคนที่เพิ่งเข้าวงการ SEO อาจกำลังศึกษาเรื่องนี้อยู่ โดย Technical SEO คือ การปรับแต่งด้านเทคนิคของเว็บไซต์เพื่อให้เครื่องมือค้นหาอย่าง Google สามารถเข้าถึง อ่าน และจัดอันดับเว็บไซต์ได้ดียิ่งขึ้น ซึ่งการใช้ WordPress hooks สามารถช่วยปรับปรุง Technical SEO ได้หลายด้าน เช่น
- ปรับปรุงความเร็วของเว็บไซต์
- จัดการ HTTP Headers
- ปรับแต่ง Meta Tags
- ควบคุมการโหลดของ CSS และ JavaScript
มาดูกันว่าเราจะใช้ WordPress Hooks อย่างไรเพื่อปรับปรุง Technical SEO
wp_enqueue_scripts เพื่อจัดการไฟล์ CSS และ JavaScript
หนึ่งในปัญหาที่พบบ่อยใน WordPress คือการโหลดไฟล์ CSS และ JavaScript ที่ไม่จำเป็นในทุกหน้า ซึ่งส่งผลให้เว็บไซต์โหลดช้าลง เราสามารถใช้ hook wp_enqueue_scripts เพื่อควบคุมการโหลดไฟล์เหล่านี้ได้ ตัวอย่างเช่น
function my_dequeue_script(){
if ( !is_page('contact') ) {
wp_dequeue_script('contact-form-7');
wp_dequeue_style('contact-form-7');
}
}
add_action('wp_enqueue_scripts', 'my_dequeue_script', 99 );
โค้ดนี้จะยกเลิกการโหลดไฟล์ของ Plugin Contact Form 7 ในหน้าที่ไม่ใช่หน้าติดต่อ ซึ่งช่วยลดเวลาในการโหลดหน้าเว็บโดยรวม
wp_head เพื่อเพิ่ม Preload Resources
สำหรับ Hook wp_head เป็นตัวช่วยให้เราสามารถเพิ่ม Resources ต่าง ๆ อย่าง JS หรือ CSS ในส่วน <head> ของ HTML ได้ เราสามารถใช้มันเพื่อ Preload ทรัพยากรที่สำคัญ เช่น ฟอนต์หรือรูปภาพ ซึ่งจะช่วยปรับปรุงคะแนน Largest Contentful Paint (LCP) เช่น
<?php
function my_preload() {
?>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap"/>
<link rel="preload" as="image" href="https://www.yoursite.com/logo.jpg"/>
<?php
}
add_action('wp_head', 'my_preload', 3 );
?>
script_loader_tag เพื่อ Defer หรือ Async โหลด JavaScript
การ Defer หรือ Async โหลด JavaScript เป็นวิธีที่ดีในการปรับปรุงประสิทธิภาพของเว็บไซต์ เราสามารถใช้ Hook script_loader_tag ได้ดังนี้
function my_defer_async_load( $tag, $handle ) {
$async_handles = array('wpcf7-recaptcha');
$defer_handles = array('contact-form-7');
if( in_array( $handle, $async_handles) ){
return str_replace( ' src', ' async src', $tag );
}
if( in_array( $handle, $defer_handles ) ){
return str_replace( ' src', ' defer src', $tag );
}
return $tag;
}
add_filter('script_loader_tag', 'my_defer_async_load', 10, 2);
template_redirect เพื่อจัดการ HTTP Status Codes
บางครั้ง เราอาจต้องการเปลี่ยน HTTP Status Code สำหรับหน้าบางหน้า เพื่อป้องกันการสแปม Backlinks ที่มายังหน้าเว็บไซต์ เช่นหากมีลิงก์สแปมแปลกๆ ที่เป็นภาษาเกาหลี Hook template_redirect จะสามารถช่วยแก้ไขได้ โดยมีรูปแบบโค้ดดังนี้
function my_410_function(){
if( is_search() && preg_match('/[\x{AC00}-\x{D7AF}]+/u', $_GET['s']) ) {
status_header(410, 'Gone');
exit();
}
}
add_action( 'template_redirect', 'my_410_function', 10 );
โดยโค้ดนี้จะส่ง Status Code 410 (Gone) สำหรับการค้นหาที่มีตัวอักษรภาษาเกาหลี ซึ่งอาจเป็นประโยชน์ในการจัดการกับลิงก์สแปม
wp_headers เพื่อเพิ่ม Security Headers
การเพิ่ม Security Headers เป็นวิธีที่ดีในการปรับปรุงความปลอดภัยของเว็บไซต์ โดยเราสามารถใช้ hook wp_headers ดังนี้
function my_headers($headers){
$headers['Content-Security-Policy'] = 'upgrade-insecure-requests';
$headers['Strict-Transport-Security'] = 'max-age=31536000; preload';
$headers['X-Content-Type-Options'] = 'nosniff';
$headers['X-XSS-Protection'] = '1; mode=block';
return $headers;
}
add_filter( 'wp_headers', 'my_headers', 100 );
นอกจากการเพิ่ม Security Headers แล้ว เรายังสามารถเพิ่ม Link Tags จำนวนกี่ลิงก์ก็ได้ เพื่อ Preload ทรัพยากร ซึ่งเป็นอีกหนึ่งวิธีในการทำ Preload นอกจาก wp_head นั่นเอง
สรุป WordPress Hooks เป็นเครื่องมือที่ช่วยให้การปรับแต่งเว็บไซต์ราบรื่นยิ่งขึ้น โดยเฉพาะอย่างยิ่งสำหรับการทำ Technical SEO การใช้ Hooks ที่เหมาะสมสามารถช่วยปรับปรุงประสิทธิภาพของเว็บไซต์ ความปลอดภัย และการจัดอันดับบน Google หรือ Search Engine ต่างๆ ได้อย่างมีประสิทธิภาพ แม้ว่าการใช้ WordPress hooks อาจดูซับซ้อนในตอนแรก แต่ก็เป็นวิธีที่ยืดหยุ่นและมีประสิทธิภาพในการควบคุมเว็บไซต์ โดยไม่ต้องพึ่งพา Plugin มากเกินไป อย่างไรก็ตาม ควรระมัดระวังเมื่อใช้งาน WordPress Hooks เพราะการใช้งานที่ไม่ถูกต้องอาจส่งผลเสียต่อเว็บไซต์ได้
ท้ายที่สุด การเรียนรู้และใช้งาน WordPress hooks ไม่เพียงแต่จะช่วยปรับปรุง Technical SEO ของเว็บไซต์คุณเท่านั้น แต่ยังช่วยให้คุณมีความเข้าใจที่ลึกซึ้งขึ้นเกี่ยวกับการทำงานของ WordPress อีกด้วย ซึ่งจะเป็นประโยชน์อย่างมากในการพัฒนาเว็บไซต์ในระยะยาว
เกี่ยวกับ Relevant Audience
พวกเรา Relevant Audience คือ Digital Performance Marketing Agency ที่เชี่ยวชาญด้านการทำ SEO และเป็นหนึ่งใน Digital Agency ที่มีบริการด้านการตลาดดิจิทัลครบวงจร เพื่อสนับสนุนธุรกิจให้เข้าถึงกลุ่มเป้าหมายในเวลา สถานที่ และบนอุปกรณ์ที่เหมาะสม (Right Time, Right Place, Right Device)
บริการของเราครอบคลุมทั้งบริการทำ SEO, Search Marketing, Social Media Ads, Search Ads ไปจนถึง Influencer Marketing และเรายังเป็น SEO Company ที่เป็น Google Partners อีกด้วย โดยทีมของเราล้วนเป็นผู้เชี่ยวชาญเฉพาะทาง พร้อมให้คำปรึกษาและค้นหาโซลูชันที่ตอบโจทย์ธุรกิจ
ติดต่อสอบถามข้อมูลเพิ่มเติม ปรึกษาทำการตลาดออนไลน์
โทร.: 02-038-5055
อีเมล: info@relevantaudience.com
เว็บไซต์: www.relevantaudience.com
