การสร้างและจัดการเมนู Wordpress Menus

การสร้างและจัดการเมนู WordPress

เมนู คือ องค์ประกอบที่สำคัญสำหรับการสร้างเว็บไซต์ที่ทุกเว็บจะต้องมี โดยระบบการจัดการ Menu บน WordPress นั้นสามารถสร้างได้หลายชุด แต่ทั้งนี้ก็จะขึ้นอยู่กับธีมที่ใช้ด้วยว่า ธีมนั้นๆกำหนดให้แสดงเมนูได้กี่ตำแหน่ง

โดยทั่วไปการกำหนดตำแหน่งของเมนูจะมีดังนี้

  • Main Menu คือ เมนูหลักที่อยู่ด้านบนสุดของเว็บ แสดงผลที่ตำแหน่ง Header โดยทั่วไปจะกำหนด Display location เป็น Primary Menu
  • Main Menu Mobile คือ เมนูหลักที่อยู่ด้านบนสุดของเว็บ แต่จะให้แสดงผลเมื่อเว็บถูกเปิดบน Mobile โดยเมนูจะถูกย่อเป็น Toggle เมื่อกดที่ Toggle ก็จะแสดงเมนูออกมา ตำแหน่งนี้ถ้าเมนูหลักที่แสดงผลบน Desktop กับเมนูหลักที่แสดงบน Mobile ไม่ได้แตกต่างกัน ก็ไม่จำเป็นต้องใช้
  • Footer Menu คือ เมนูที่แสดงผลบริเวณ Footer เมนูนี้อาจจะแสดงผลตัวเลือกอื่นๆ ที่ไม่จำเป็นต้องเหมือนเมนูหลัก เป็นหน้าที่ User อาจจะไม่ได้เข้าไปชมบ่อยๆ เช่น หน้า Privacy Policy หรือ About Us เป็นต้น

การสร้างเมนูใน WordPress

ที่หลังบ้าน WordPress เลือกที่ Appearance –> Menus

เมนู,menus,menu,wordpress

คลิกที่ Create a new menu เพื่อสร้างเมนูใหม่

เมนู,menus,menu,wordpress

ที่ Menu Name ตั้งชื่อเมนูได้ตามใจ แต่ควรตั้งให้สื่อความหมายเข้าใจว่าเมนูนั้นๆคือเมนูอะไร ในส่วนของ Menu Settings ให้เลือก Display location เพื่อกำหนดว่าจะใช้เมนูดังกล่าวแสดงผลที่ไหน ซึ่งตรงนี้ถ้ายังไม่แน่ใจก็ปล่อยว่างไว้ก่อนได้ เสร็จแล้วคลิกที่ Create Menu

เมนู,menus,menu,wordpress

เมื่อคลิกที่ Create Menu แล้ว ก็จะเข้ามาสู่หน้าเมนูนั้นๆโดยอัตโนมัติ กรณีที่เราต้องการแก้ไขเมนูที่มีอยู่แล้วก็ให้เลือกที่ Select a menu to edit แล้วคลิกที่ Select

เมนู,menus,menu,wordpress

ที่หน้าแก้ไขเมนู ให้เลือกหน้า Page/Post ที่ต้องการจาก Add menu items โดยติ๊กถูกที่หน้านั้นๆ แล้วคลิกที่ Add to menu เพื่อเพิ่มเข้ามาที่เมนู

เมนู,menus,menu,wordpress
เมนู,menus,menu,wordpress

หน้าดังกล่าวก็จะที่ถูกเพิ่มเข้าในเมนู

เมนู,menus,menu,wordpress

สามารถใช้การคลิกค้างลากที่เมนูนั้นๆ เลื่อนขึ้นลง เพื่อปรับตำแหน่งการแสดงผลของเมนูได้ หรือปรับเป็นเมนูย่อยได้ เช่นในภาพตัวอย่างต้องการทำให้ หน้าทดสอบ เป็นเมนูย่อยของ หน้าตัวอย่าง ก็คลิกค้างลาก หน้าทดสอบ ไปทางขวา 1 สเต็ป โดยที่ หน้าทดสอบ ต้องอยู่ถัดจาก หน้าตัวอย่าง

เมนู,menus,menu,wordpress

การลด-เพิ่มตัวเลือกใน Menu Items

โดยปกติแล้วตัวเลือกใน Add menu items ที่ใช้เพิ่มหน้าต่างๆเข้ามา ค่าเริ่มต้นจะมีอยู่ไม่กี่อย่าง เช่น Pages, Posts, Categories หรือ Custom Links ตรงนี้เราสามารถปรับเพิ่มได้ โดยคลิกที่ Screen Options ที่อยู่บริเวณมุมบนขวา เพื่อเปิด Screen elements ขึ้นมา ก็จะมีตัวเลือกให้เราติ๊กเพิ่ม ทั้งนี้ตัวเลือกจะมากหรือน้อยก็ขึ้นอยู่กับ Plugins ที่ลงด้วย

เมนู,menus,menu,wordpress

การปรับตัวเลือกแสดงคุณสมบัติเมนูขั้นสูง

นอกจากนี้ใน Screen elements ยังมีแถบ Show advanced menu properties เป็นการปรับเพิ่มการ

Link Target : ตัวเลือก Open link in a new tab เมื่อคลิก Link แล้วเปิดแท็บใหม่
Title Attribute : ใส่คำอธิบายของเมนูนั้นๆ โดยคำอธิบายจะปรากฏเมื่อนำเคอร์เซอร์เมาส์ไปชี้
CSS Classes : สำหรับ Custom CSS เอง
Link Relationship (XFN) : เป็นการกำหนดความสัมพันธ์ของเราที่มีต่อ Links ที่เราสร้างขึ้น โดยการใส่ค่า Tag
Description : คำอธิบายโดยละเอียด

สำหรับข้อมูลเกี่ยวกับการกำหนด Link Relationship ใน WordPress สามารถเข้าไปดูได้ที่นี่ https://byyoursites.wordpress.com/2012/12/30/wordpress-basic-14/

เมนู,menus,menu,wordpress
เมนู,menus,menu,wordpress

ตัวเลือกใน Menu Items ที่น่าสนใจอีก 1 อย่างก็คือ Custom Links โดยตัวเลือกนี้เราสามารถใส่ URL Link ปลายทางได้เอง

เมนู,menus,menu,wordpress
เมนู,menus,menu,wordpress

การลบ Menu Items

การลบ Menu Items ที่เลือกเข้าแต่ไม่ได้ใช้หรือเลือกผิด สามารถทำได้ง่ายๆ คือคลิกที่ลูกศรด้านขวาของ Menu Items ที่ต้องการลบและคลิกที่ Remove

เมนู,menus,menu,wordpress

ทิ้งท้ายไว้ให้สำหรับผู้ที่อยากศึกษาเพิ่มเติม สามารถเข้าไปดู User Guide ของเว็บ WordPress ได้ที่นี่ -> WordPress Menu User Guide

Scroll to Top