Widget WordPress หากเราใช้มันอย่างถูกต้อง มันจะมีประโยชน์อย่างมาก เพราะมันสามารถสร้าง “ชุด Content พิเศษ” เช่น ข้อความแจ้งเตือน, ฟอร์มลงทะเบียน, ลิงค์ติดตาม นำไปแสดงในส่วนต่างๆ ได้อย่างอิสระไม่ว่าจะเป็น Post หรือ Page ต่อไปนี้จะเรียกว่า Widget Area
หลายท่านที่ใช้ WordPress คล่องแล้ว อาจจะพอรู้จักการประยุกต์ใช้ “Widget – วิดเจ็ต” กับส่วนต่างๆ ของเว็บไซต์ แต่สำหรับมือใหม่ อาจจะยังไม่เข้าใจว่า จริงๆ แล้ววิดเจ็ตเกิดมาเพื่ออะไรบ้าง และสามารถนำไปประยุกต์ใช้ยังไงบ้าง เรามาเรียนรู้ด้วยกันครับ Widget WordPress คืออะไร ใช้งานยังไงบ้าง
Widget WordPress คืออะไร
Widget คือ โมดูลนึงที่อยู่ในเวิร์ดเพรส หรือ จะเรียกว่าเป็น “ชิ้นส่วน” บ้างก็เรียกว่า Block ที่ถูกเขียนขึ้นมาให้มีฟังก์ชันการทำงานเฉพาะด้าน เตรียมให้เราหยิบไปวางในตำแหน่งวิดเจ็ตต่างๆ ตัวอย่างเช่น ปฏิทิน, ช่องค้นหา, โพสล่าสุด, ข้อความ, รูปภาพ ฯลฯ ซึ่งเราสามารถหยิบวิดเจ็ตเหล่านี้ไปวางในตำแหน่งต่างๆ ได้เลย
Widget ประกอบด้วย 2 ส่วนหลักๆ
- Widget (วิดเจ็ต)
- Widget Area (ตำแหน่งที่แสดงวิดเจ็ต)
ไปที่เมนู Appearance –> Widgets
เพื่อให้เห็นภาพในระหว่างที่ผมกำลังอธิบาย ดูรูปข้างล่างนี้ประกอบ
Widget คือ ส่วนด้านซ้ายมือ (A)
ซึ่งจะมีโมดูลสำเร็จรูปต่างๆ ที่ทาง WordPress เตรียมมาให้เราเรียบร้อย ช่วงที่ติดตั้ง WordPress แรกๆ จะมีจำนวนเท่ากันหมด แต่เมื่อเราติดตั้ง Theme และ Plugin เพิ่มเติม อาจจะมีวิดเจ็ตใหม่ๆ ถูกเพิ่มเข้ามา
วิดเจ็ตที่ให้มา (ตามภาพ) เช่น Calendar, Categories, HTML, Gallery, Pages, Menus, Text, Image เป็นต้น
วิดเจ็ตที่ให้มาก็ไม่ได้จำเป็นซะทั้งหมด เราอยากใช้ปฏิทิน ก็ดึงมาแค่ปฏิทิน หยิบไปใส่ในตำแหน่ง Widget Area ที่ธีมเตรียมให้
ส่วนใหญ่ Theme ที่ขายดีบน Themeforest(เว็บขายธีมระดับโลก) จะมีวิดเจ็ตพิเศษเพื่อเพิ่มความน่าสนใจให้กับเว็บไซต์ โดยปกติถ้าเราต้องการเพิ่มวิดเจ็ตพิเศษ เราต้องติดตั้งปลั๊กอิน หรือไม่ก็เขียน Code ขึ้นมาเอง
Widget Area คือ ส่วนด้านขวามือ (B)
Widget Area คือ ตำแหน่งพื้นที่ ที่เราจะแสดง Widget โดยปกติแล้วตำแหน่งวิดเจ็ตจะมีไม่มาก แต่ถ้าเราเข้าใจ Code PHP ก็สามารถสร้างตำแหน่ง Widget Area ขึ้นมาเอง แล้วสามารถแสดงในตำแหน่งไหนของธีมก็ได้ ซึ่งโดยทั่วไปก็จะมี เช่น
- Left Sidebar
- Right Sidebar
- Header
- Footer
- Shop Sidebar
ซึ่ง Widget Area จะมีมาก หรือ น้อย ขึ้นอยู่กับธีมที่เราใช้
เพื่อให้เห็นภาพว่า Widget Area คือตำแหน่งไหนบ้างบนเว็บไซต์จริงๆ เรามาดูตัวอย่างการเรียกชื่อของตำแหน่งต่างๆ บนเว็บไซต์
- Top / Header : ส่วนบนสุดของเว็บไซต์
- Left Sidebar : ส่วนด้านซ้ายของเว็บไซต์
- Right Sidebar : ส่วนด้านขวาของเว็บไซต์
- Footer : ส่วนด้านล่างสุดของเว็บไซต์
นี่คือตำแหน่งที่เราจะแสดง Widget ถ้าหากต้องการปรับแต่ง Widget Area ได้มากกว่านี้ ลองไปเล่นปลั๊กอิน Custom Sidebars
วิธีใช้งาน Widget
ไปที่เมนู Appearance –> Widgets
คลิกเลือก Widget ที่ต้องการใช้งาน ในภาพตัวอย่าง ผมต้องการดึง Categories ไปแสดงที่ Right Sidebar ของบทความ
ซึ่งต้องเช็คการตั้งค่าของธีมให้แน่ใจก่อนว่า ได้เปิดตำแหน่ง Right Sidebar ไว้ *หลายๆ ธีมมีปุ่ม เปิด-ปิด Sidebar
- กรอกชื่อ Title หรือ ชื่อวิดเจ็ต
- Display as dropdown : คือ แสดงเป็น Dropdown
- Show post counts : คือ แสดงจำนวนโพส ในแต่ละหมวดหมู่
- Show hierarchy คือ แสดงแบบลำดับชั้น
- Delete : ลบวิดเจ็ต
- Done : แก้ไขเรียบร้อยแล้ว
- Save : บันทึกการตั้งค่า
สังเกตว่า ด้านขวามือก็จะมี Widget ชื่อ “หมวดหมู่บทความ” ปรากฏขึ้นมา
เมื่อไหร่ควรใช้ Widget?
เมื่อไหร่ก็ตามที่เราต้องการแสดงคอนเทนต์พิเศษ “Extra Content” ในหน้าเพจต่างๆ ( Page, Post, Post Type ) ในตำแหน่งที่แสดงวิดเจ็ต หรือ Widget Area ที่ไม่ใช่ส่วนตรงกลางของหน้า ซึ่งข้อดีของวิดเจ็ตคือ สามารถแสดงได้หลายหน้า เช่น แสดงบทความล่าสุด ในตำแหน่ง Right Sidebar
หลายเว็บไซต์มักจะแสดง Call to action หรือช่องทางการติดต่อ เพื่อกระตุ้นให้ลูกค้าติดต่อเรามากขึ้น ถ้าเป็นเว็บไซต์ข่าว ก็มักจะแสดงบทความล่าสุด เพื่อให้คนอ่านสังเกตบทความสดใหม่ได้
เรายังสามารถประยุกต์ Widget ได้อีกเยอะเลย หากเราใช้งาน WordPress คล่องมากขึ้น
ทั้งนี้ Widget Area หรือ ตำแหน่งที่จะแสดงวิดเจ็ต จะมากจะน้อย ขึ้นอยู่กับ Theme ที่เราเลือกใช้ บางธีมให้น้อย บางทีมให้เยอะมาก โดยเฉพาะธีมพรีเมี่ยมที่เสียตังค์ซื้อ
ถ้ารู้การเขียนโค้ด สามารถเขียนเพิ่ม หรือ เพิ่มตำแหน่ง Widget Area ได้ ลองศึกษา Widget WordPress ได้เลยครับ
11 Widget ที่ใช้บ่อย
เพื่อให้เพื่อนๆ ให้ภาพชัดเจนมากขึ้น ผมจะพาแนะนำ Widget ที่คิดว่าได้ใช้บ่อยๆ และจะลองแสดงวิตเจ็ตในตำแหน่ง “Rigth Sidebar” หรือตำแหน่งด้านขวามือ
1. Recent Posts Widget
Recent Posts เป็นวิดเจ็ตที่น่าจะใช้บ่อยที่สุด สำหรับเว็บไซต์ที่มีบทความ ข่าวสาร กิจกรรม
ทำให้เราสามารถแสดง “บทความล่าสุด” ในตำแหน่ง Widget Area เช่น Left, Right Sidebar ช่วยให้ผู้อ่าน สามารถเข้าถึงบทความล่าสุดได้ง่ายขึ้น เพราะมันไปแสดงในทุกๆ หน้า ซึ่งจะมีการตั้งค่าดังนี้
- Title : ชื่อวิดเจ็ต
- Number of posts to show : จำนวนบทความที่จะแสดง
- Display post date? : จะแสดงวันที่ด้วยหรือไม่
Recent Posts ที่มากับเวิร์ดเพรสตอนแรก มีการตั้งค่าน้อยมา ซึ่งหากเราต้องการปรับแต่งได้มากขึ้น แนะนำให้ติดตั้งปลั๊กอินเสริม ชื่อ “WordPress Popular Posts“
2. Calendar Widget
Calendar เป็นวิดเจ็ตสำหรับแสดงปฏิทินธรรมดาๆ ทั่วไปครับ เว็บบริษัททั่วไปส่วนใหญ่ไม่ค่อยแสดง จะไปเจอพวกเว็บไซต์ราชการซะส่วนใหญ่
3. Categories Widget
Categories เป็นวิดเจ็ตสำหรับแสดงรายการ “หมวดหมู่บทความ” สำหรับเว็บไซต์บทความ เว็บบล็อค น่าจะมีประโยชน์ เพราะบางที ถ้าเรามีบทความเยอะ การเข้าถึงผ่านหมวดหมู่ น่าจะง่ายและไวสุด
การตั้งค่าหลักๆ
- Title : ชื่อวิดเจ็ต
- Display as dropdown : แสดงหมวดหมู่เป็นแบบเมนูย่อย
- Show post counts : แสดงจำนวนบทความในหมวดหมู่
- Show hierarchy : แสดงเป็นแบบลำดับชั้น
4. Custom HTML Widget
Custom HTML เป็นวิดเจ็ตที่ให้เราแทรก Code HTML ได้ น่าจะเหมาะสำหรับคนที่มีพื้นฐานด้านการเขียน Code มาบ้าง เช่นการเขียน HTML, CSS น่าจะประยุกต์ใช้งานได้ สิ่งที่วิดเจ็ตให้มาก็แค่กล่องเขียนโค้ดเปล่าๆ ที่เหลือเราก็ไปประยุกต์ใช้งานเองได้เลยครับ
5. Gallery Widget
Gallery เป็นวิดเจ็ตไว้แสดงรูปภาพเป็นรูปแบบแกลอรี่ สำหรับแสดงรูปภาพเป็นแกลอรี่ในตำแหน่ง Sidebar ซึ่งมันก็เหมือนกับระบบ gallery ที่ใช้ใน Page, Post นั้นแหละครับ วิธีใช้งานก็แค่คลิก “Add Images” แล้วสามารถเลือกรูปภาพหลายๆ ภาพได้ครับ เทคนิคคือ คลิก Ctrol + จิ้มเลือกรูปภาพได้เลย และยังเลือกได้ว่า จะแสดงกี่คอลัมน์
6.Image Widget
Image เป็นวิดเจ็ตสำหรับใส่รูปภาพ ภาพเดียว ซึ่งวิธีการใช้งานก็จะเหมือนวิดเจ็ต Gallery เลย แค่ต่างกันที่จำนวนรูปภาพที่เลือกได้
Navigation Menu เป็นวิดเจ็ตสำหรับดึงเมนูมาแสดง ในตำแหน่ง Widget Area ต่างๆ
ซึ่งโดยปกติแล้ว เรามักจะประยุกต์ใช้ในการดึง Category และ Tag มาแสดงในตำแหน่ง Sidebar หรือ ไม่ก็แสดง Menu เมนูย่อยมาตำแหน่ง Sidebar ก็ได้เช่นกัน
บ่อยครั้งผมมักจะใช้ดึง เมนูหลัก มาแสดงในตำแหน่ง Footer เพื่อให้คนเข้าเว็บเข้าถึงเมนูต่างๆ ได้สะดวกมากขึ้น
8. Recent Comments Widget
Recent Comments เป็นวิดเจ็ต สำหรับแสดง Comment แสดงความคิดเห็นในโพสล่าสุด วิธีการใช้ก็แค่ลากวิดเจ็ตมาใส่
9. Search Widget
Search เป็นวิดเจ็ต สำหรับทำกล่องค้นหาในเว็บไซต์ เหมาะสำหรับเว็บไซต์ที่มีข้อมูลค่อนข้างเยอะ การมีช่องค้นหา ช่วยให้การค้นหาข้อมูลได้ง่ายขึ้น น่าจะเป็นวิดเจ็ตนึงที่ใช้งานค่อนข้างบ่อยเหมือนกัน
10. Tag Cloud Widget
Tag Cloud เป็นวิดเจ็ตสำหรับแสดงแท็ก (Tag) ที่มาจากโพสต่างๆ น่าจะเหมาะสำหรับเว็บข่าว ที่มีการใส่แท็กเยอะๆ และมีโพสจำนวนมาก ไม่ค่อยแนะนำสำหรับเว็บที่มีจำนวนโพสน้อยๆ จะดูรกเปล่าๆ
11. Text Widget
Text Widget เป็นวิดเจ็ตสำหรับใส่ข้อความ มันจะให้เป็นช่อง Editor แบบง่ายๆ ให้เราใช้งาน สามารถเพิ่มไฟล์ภาพได้, ทำตัวหน้า เอียง หรือจะเป็นลิสก็ได้ เป็นลิงค์ก็ดี หรือถ้าต้องการแก้ไขโค้ด HTML สามารถคลิกที่แท็บ Text
สรุป
Widget WordPress เป็นหนึ่งในฟีเจอร์ของเวิร์ดเพรสที่เรียบง่าย แต่ทรงพลัง หากเราใช้งานถูกที่ถูกเวลา ก็น่าจะทำให้เว็บไซต์เราได้ประโยชน์จากวิดเจ็ตพอสมควร หาเราเป็นโปรแกรมเมอร์ หรือ รู้วิธีการขียนโค้ด สามารถพัฒนาต่อยอดได้อีก โดยการเพิ่มตำแหน่ง Widget Area ในตำแหน่งที่ต้องการ
เพื่อนๆ ลองไปประยุกต์ใช้งานดูครับ หากมีคำถามก็ทักเข้ามาในเพจได้เลยครับ…
