วิธีทำ WordPress Plugin ใช้เองแบบง่าย ๆ

<h3>วิธีทำ WordPress Plugin ใช้เองแบบง่าย ๆ <&sol;h3>&NewLine;<p><&sol;br><br &sol;>&NewLine;Wordpress เป็น CMS ที่เพียบพร้อม ใช้งานค่อนข้างง่ายและสะดวกสบาย เหมาะกับผู้เริ่มต้นเรียนรู้ทำเว็บไซต์ไว้<br &sol;>&NewLine;ใช้งานเอง สำหรับ WordPress แล้วมี plugin ทั้งแบบฟรีและเสียเงินให้เลือกใช้มากมาย แต่ plugin สำคัญ ที่ตรง<br &sol;>&NewLine;กับความต้องการของเรา มักจะต้องเสียเงินซื้อเพื่อให้ได้ใช้งานฟีเจอร์สำคัญ ๆ ของ plugin นั้น ๆ อย่างเต็มความสามารถ<br &sol;>&NewLine;<&excl;--more--><&sol;p>&NewLine;<p>เพราะฉะนั้นการสร้าง Plugin หรือส่วนเสริมเพิ่มขึ้นมาเป็นอีกหนึ่งช่องทางที่จะทำให้เว็บไซต์ ของเราสามารถทำงานได้ตรง<br &sol;>&NewLine;ตามความต้องการของเรามากที่สุด ที่สำคัญการสร้าง wordpress plugin ไม่ไช่เรื่องยุ่งยากอะไรมากนัก และถ้าผู้พัฒนา<br &sol;>&NewLine;เว็บไซต์มีพื้นฐานการเขียนโปรแกรมภาษา PHP เบื้องต้นมาอยู่แล้ว ก็ยิ่งจะทำให้การพัฒนา plugin สำหรับ wordpress<br &sol;>&NewLine;เป็นเรื่องง่ายขึ้นไปอีก ลองมาดูกันครับว่า ทำ wordpress plugin ต้องจัดการกับอะไรบ้าง<br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;<h4>2 ฟังก์ชั่นหลัก สำหรับการสร้าง WP plugin<&sol;h4>&NewLine;<ul>&NewLine;<li><strong>wp&lowbar;action<&sol;strong><&sol;li>&NewLine;<p>ใช้สำหรับเพิ่มความสามารถใหม่ ๆ เข้าไปในเว็บไซต์ wordpress<&sol;p>&NewLine;<li><strong>wp&lowbar;filter<&sol;strong><&sol;li>&NewLine;<p>ใช้สำหรับปรับปรุงแก้ไขความสามารถต่าง ๆ ที่มีอยู่แล้วในเว็บไซต์ wordpress&NewLine;<&sol;ul>&NewLine;<p><&sol;br><&sol;p>&NewLine;<h4>เริ่มสร้างและทดสอบติดตั้ง plugin<&sol;h4>&NewLine;<ul>&NewLine;<li>1&period; สร้างโฟลเด้อขึ้นมาครับตั้งชื่อว่า <strong>hello-wp-plugin<&sol;strong><&sol;li>&NewLine;<li>2&period; สร้างไฟล์ชื่อว่า <strong>hello-wp-plugin&period;php<&sol;strong> วางไว้ในโฟลเด้อ <strong>hello-wp-plugin<&sol;strong><&sol;li>&NewLine;<li>3&period; ในไฟล์ <strong>hello-wp-plugin&period;php<&sol;strong> ให้เขียนรายละเอียด comment code โดยให้มีโครงสร้างดังนี้ครับ&NewLine;<pre class&equals;"lang&colon;default decode&colon;true " title&equals;"hello-wp-plugin&period;php">&lt&semi;&quest;php &NewLine;&Tab; &sol;&ast;&ast; &NewLine;&Tab; &ast; Plugin Name&colon; Hello WP Plguin &NewLine;&Tab; &ast; Plugin URI&colon; http&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol; &NewLine;&Tab; &ast; Description&colon; just a test wordpress plugin &NewLine;&Tab; &ast; Version&colon; 1&period;0&period;0 &NewLine;&Tab; &ast; Author&colon; Codebee Company Limited &NewLine;&Tab; &ast; Author URI&colon; http&colon;&sol;&sol;www&period;codebee&period;co&period;th &NewLine;&Tab; &ast; License&colon; GPL2 &NewLine;&Tab; &ast;&sol; &NewLine;&quest;&gt&semi;<&sol;pre>&NewLine;<li>4&period; ทดลองติดตั้ง plugin โดยให้อัพโหลดไปไว้ที่ wp-content&sol;plugins&sol;hello-wp-plugin<&sol;li>&NewLine;<li>5&period; ไปที่หน้า Plugins ของ WordPress จะเห็นรายละเอียดของ hello-wp-plugin ตามที่เราได้เขียนไว้ ดังรูป<br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;<img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2016&sol;08&sol;วิธีสร้าง-wordpress-plugin&period;png" alt&equals;"วิธีสร้าง wordpress plugin" &sol;><br &sol;>&NewLine;<&sol;br>&NewLine;<&sol;ul>&NewLine;<p>ในหัวข้อนี้เราได้สร้างไฟล์ต้นแบบของ wordpress plugin เรียบร้อยแล้วครับ ในหัวข้อต่อไปลองมาทดสอบใช้<br &sol;>&NewLine;2 คำสั่ง add&lowbar;action และ add&lowbar;filter เพิ่มความสามารถและปรับปรุงข้อมูลบางอย่างของ wordpress กันครับ<br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;<h4>ใช้คำสั่ง add&lowbar;action<&sol;h4>&NewLine;<p>เปิดไฟล์ hello-wp-plugin&period;php ที่เราได้สร้างไว้ในหัวข้อที่แล้ว และเพิ่มคำสั่ง add&lowbar;action เข้าไป<br &sol;>&NewLine;โดยที่จุดประสงค์หลักของ plugin ตัวนี้คือต้องการเพิ่ม meta copyright เข้าไปในส่วน header ของหน้าเว็บไซต์<br &sol;>&NewLine;เราจะสามารถเขียนโค๊ดได้ประมาณนี้ครับ<&sol;p>&NewLine;<pre class&equals;"lang&colon;default decode&colon;true " > &NewLine;function your&lowbar;function&lpar;&rpar; &lbrace; &NewLine;&Tab;echo "&lt&semi;meta name&equals;'copyright' content&equals;'company name'&gt&semi;"&semi; &NewLine;&rcub; &NewLine;add&lowbar;action&lpar;'wp&lowbar;head'&comma; 'your&lowbar;function'&rpar;&semi; &NewLine;<&sol;pre>&NewLine;<p><strong>อธิบายคำสั่ง add&lowbar;action<&sol;strong><&sol;p>&NewLine;<ul>&NewLine;<li>ฟังก์ชั่น add&lowbar;action ต้องการพารามิเตอร์หลัก ๆ อยู่ 2 ตัวคือ tag และ callable พารามิเตอร์ตัวแรกคือ tag<br &sol;>&NewLine;ส่วนนี้เราสามารถดูรายชื่อทั้งหมดได้ที่เว็บไซต์ <a href&equals;"https&colon;&sol;&sol;developer&period;wordpress&period;org&sol;reference&sol;" target&equals;"&lowbar;blank">https&colon;&sol;&sol;developer&period;wordpress&period;org&sol;reference&sol;<&sol;a><&sol;p>&NewLine;<li>พารามิเตอร์ตัวที่ 2 คือ your&lowbar;function เป็น callable ฟังก์ชั่นที่จะเริ่มทำงานเมื่อระบบของ wordpress<br &sol;>&NewLine;เริ่มการทำงานและรันสคลิปต์มาถึงส่วน tag นั้น ๆ ใน plugin ที่เราสร้างคือให้เพิ่ม meta copyright เข้าไปนั่นเอง<&sol;li>&NewLine;<li>คำสั่ง add&lowbar;action ยังสามารถเพิ่มพารามิเตอร์อื่น ๆ เข้าไปได้อีก แต่หลัก ๆ จะต้องการแค่ 2 ตัวคือ tag กับ<br &sol;>&NewLine;callable function วิธีเพิ่มพารามิเตอร์หรือตัวแปรอื่น ๆ ก็สามารถเพิ่มเข้าไปต่อจากฟังก์ชั่นได้เลยครับ ตัวอย่างเช่น<&sol;p>&NewLine;<pre class&equals;"lang&colon;default decode&colon;true " >add&lowbar;action&lpar;'wp&lowbar;head'&comma; 'your&lowbar;function'&comma;&dollar;name&comma;&dollar;content&rpar;&semi;<&sol;pre>&NewLine;<p>และเมื่อเข้าไปทำงานในฟังก์ชั่นเราก็สามารถเขียนได้ในลักษณะแบบนี้ได้ครับ<&sol;p>&NewLine;<pre class&equals;"lang&colon;default decode&colon;true " >function your&lowbar;function&lpar;&dollar;name&comma;&dollar;content&rpar; &lbrace; &NewLine;&Tab;echo "&lt&semi;meta name&equals;'"&period;&dollar;name&period;"' content&equals;'"&period;&dollar;content&period;"'&gt&semi;"&semi; &NewLine;&rcub;<&sol;pre>&NewLine;<&sol;li>&NewLine;<&sol;ul>&NewLine;<p><&sol;br><&sol;p>&NewLine;<h4>ใช้คำสั่ง add&lowbar;filter<&sol;h4>&NewLine;<p>เปิดไฟล์ hello-wp-plugin&period;php ครับลองลบคำสั่ง add&lowbar;action ออกไปและแทนที่ด้วยคำสั่ง add&lowbar;filter โดย<br &sol;>&NewLine;จุดประสงค์ของเราคือต้องการเปลี่ยน title ในหน้าติดต่อเราเป็นข้อความแบบอื่น เราจะสามารถเขียนโค๊ดได้ในลักษณะนี้ครับ<&sol;p>&NewLine;<pre class&equals;"lang&colon;default decode&colon;true " >function your&lowbar;function&lpar;&dollar;title&rpar; &lbrace; &NewLine;&Tab;if&lpar;&dollar;title &equals;&equals; "ติดต่อเรา"&rpar;&lbrace; &NewLine;&Tab;&Tab;&dollar;title &equals; "ติดต่อเค้า"&semi; &NewLine;&Tab;&rcub; &NewLine;&Tab;return &dollar;title&semi; &NewLine;&rcub; &NewLine;add&lowbar;action&lpar;'the&lowbar;title'&comma; 'your&lowbar;function' &rpar;&semi;<&sol;pre>&NewLine;<p>จะสังเกตุว่าทั้ง add&lowbar;action และ add&lowbar;filter มีลักษณะการทำงานที่คล้ายกัน คือ เริ่มจากพารามิเตอร์ตัวแรกเป็น<br &sol;>&NewLine;wp tag และตามด้วยชื่อฟังก์ชั่นที่เราต้องการให้ทำงาน แต่จะมีแตกต่างกันนิดหน่อยคือ add&lowbar;filter จะมีการ pass ตัวแปร<br &sol;>&NewLine;เป็นค่าพารามิเตอร์ติดไปกับฟังก์ชั่นด้วย โดยที่ตัวแปรนั้นจะมีหรือไม่มี ขึ้นอยู่กับ tag ที่เราเรียกใช้งานด้วยนะครับ<br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;<h4>แนวทางพัฒนา WP Plugin ใช้งานเอง<&sol;h4>&NewLine;<p>เบื้องต้นคงต้องดูที่จุดประสงค์ครับว่าเว็บไซต์ wordpress ที่เราพัฒนาอยู่ต้องการปรับปรุ่งส่วนไหนหรือต้องการเพิ่มความ<br &sol;>&NewLine;สามารถส่วนไหน ถ้าลองหา plugin ดูแล้ว ไม่มีตัวไหนที่ตรงตามความต้องการเลย ก็พัฒนาขึ้นมาใช้เองซะเลย<br &sol;>&NewLine;จากชุดคำสั่งด้านบนจะเห็นว่าการทำงานของ wordpress plugin ไม่ได้มีอะไรซับซ้อนเลย เพียงแต่ต้องหาข้อมูล<br &sol;>&NewLine;และทำความเข้าใจกับ wordpress syntax พวก Method และ Property ต่าง ๆ และพัฒนาให้ถูกต้องตามกฏเกณฑ์<br &sol;>&NewLine;ของ wordpress เท่านั้นเอง<br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;