ผู้เขียน หัวข้อ: วิธีสร้างเมนูนำทาง สำหรับ WordPress  (อ่าน 879 ครั้ง)

0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้

ออฟไลน์ smf

  • [color=green][i]"ถ้าคุณไม่สามารถอธิบายอย่างง่ายๆ ให้คนอื่นเข้าใจได้แล้วล่ะก็ แสดงว่าคุณยังเข้าใจมันไม่ดีพอ"[/i][/color]
  • Administrator
  • Hero Member
  • *****
  • กระทู้: 1,368
  • พอยท์: 5
    • ดูรายละเอียด
    • pordoo.com
    • อีเมล์
วิธีสร้างเมนูนำทาง สำหรับ WordPress
« เมื่อ: 15 เมษายน 2016, 23:51:31 »
เมนูที่เห็นในแต่ละเว็บที่ทำด้วย WordPress เกิดขึ้นจากการสร้างเมนูขึ้นมาครับ

ตามภาพด้านล่าง ที่ขีดเส้นสีแดง คือเมนูที่ผมสร้างขึ้นมาครับ
How to create navigation menus for WordPress-1 height=324

และบาง Theme ก็เพิ่มให้เราเองโดยอัตโนมัติโดยเมื่อเราเขียนบทความในรูปแบบ หน้า (pages) เช่น หน้า About หรือหน้าอื่นๆ


step 1 รู้จักหัวข้อที่จะสร้างเมนูก่อน

– ที่หน้า admin หรือหน้า Dashboard ที่เมนูซ้ายมือของผู้อ่าน คลิกไปที่ Apperance >>> Menus
How to create navigation menus for WordPress-2 height=413
steps 2 เมนู นี้ท่านได้แต่ใดมา
 

How to create navigation menus for WordPress-3 height=433

เมนูเกิดได้จาก 3 ที่ คือ

1. pages คือ เพิ่มจากบทความที่เขียนในรูปแบบหน้า (Pages) เช่น About , ติดต่อเรา เป็นต้น
เพิ่มได้โดยคลิกให้มีเครื่องหมายถูกที่หน้า ที่ต้องการ
How to create navigation menus for WordPress-4 height=332

2. Links
คือ เราสามารถเพิ่ม Links จากที่ไหนก็ได้ Link อะไรก็ได้ อาจเป็น Link ไปเว็บบอร์ด หรือเว็บอื่นๆ ที่มีประโยชน์หรือมีเนื้อหาเกี่ยวข้องกับเนื้อหาของเว็บที่เรากำลังทำ

จากภาพด้านล่าง ภายใต้หัวข้อ Links
URL คือเพิ่มที่อยู่ของเว็บปลายทางที่เราจะส่ง Links ไป (ใส่แบบเต็ม คือ ก๊อปมาทั้งหมด)
Link Text  หมายถึง ชื่อที่เราต้องการให้ปรากฏ บนหน้าเว็บ เช่น
URL = http://www.wpsmile.com/
Link Text = เว็บไซต์พื้นฐาน WordPress
เมนูจะได้เป็น เว็บไซต์พื้นฐาน WordPress  และเมื่อคลิกที่ข้อความ เว็บไซต์พื้นฐาน WordPress จะ Link ไปยัง  http://www.wpsmile.com/

How to create navigation menus for WordPress-5 height=197

3. Categories
คือ Link ที่เกิดจากการที่เราสร้างหมวดหมู่ โดยเมื่อคลิกที่ Link ประเภทนี้ จะ Link ไปที่หมวดหมู่บทความที่เราคลิก
How to create navigation menus for WordPress-6 height=323


Steps 3 จะสร้างเมนูได้อย่างไร

– คลิกไปที่ Apperance >>> Menus >>> create a new menu
How to create navigation menus for WordPress-7 height=237

– ที่เมนู Menu Name ให้กรอกชื่อเมนูที่ต้องการลงในช่องว่าง เสร็จแล้วคลิก Create Menu ด้านขวา
How to create navigation menus for WordPress-8 height=248

– จะได้เมนูที่เราสามารถเพิ่มหัวข้อ หรือเมนูย่อย ต่างๆ เข้าไป ตามภาพด้านล่าง
และเราสามารถเพิ่มเมนูต่างๆ จากความรู้จาก steps 2 เมนู นี้ท่านได้แต่ใดมา   ได้เลย
How to create navigation menus for WordPress-9 height=257

– เริ่มเพิ่มเมนูโดยคลิกช่องสี่เหลี่ยมให้มีเครื่องหมายถูกกำกับข้างหน้า เสร็จแล้วคลิก Add Menu ด้านล่าง
How to create navigation menus for WordPress-100 height=272

– เมนูที่คลิก Add Menu แล้ว จะปรากฏทางด้านขวาของเรา โดยเราสามารถเคลื่อนย้ายลำดับเมนูได้โดยการคลิกซ้ายค้างไว้
และลากขึ้นลงตามต้องการ  เมื่อเสร็จแล้วคลิกที่ Save Menu ด้านขวา
How to create navigation menus for WordPress-11 height=242


Steps 4 วิธีแสดงเมนู


เมื่อสร้างเมนูเสร็จแล้ว เลื่อนลงมาด้านล่างจะเห็น ตำแหน่งที่สามารถเพิ่มได้ (ขึ้นอยู่กับ WordPress Theme ที่เลือกใช้
บาง Theme มี 1 ที่ บาง Theme อาจมี 2 หรือมากว่า)
– ที่เมนู Menu Settings จะมีตัวเลือกอยู่ 3 หัวข้อ (เพราะ Theme ที่ผมใช้อยู่ สามารถเพิ่มเมนูได้ 2 ที่ คือ เมนูหลัก (Main Menu) และ
เมนูบนสุด (Top Menu) ตัวอย่างผมเลือกเป็น Top Menu  เมื่อเสร็จแล้วคลิก Save Menu
How to create navigation menus for WordPress-13 height=433

– เมื่อไปดูที่หน้าเว็บไซต์ จะเห็นว่าเมนูที่สร้าง ถูกนำขึ้นไปเรียบร้อยแล้ว
How to create navigation menus for WordPress-14 height=317
 
– ถ้าต้องการเปลี่ยนไปใช้เมนูอื่นๆ แทนที่เมนูนี้ ก็เพียงคลิกที่ หัวข้อ Manage Locations  ตามภาพด้านล่าง และคลิกเปลี่ยนได้ตามต้องการ
(แล้วแต่ Theme ที่ใช้ว่าจะมีกี่เมนู)
How to create navigation menus for WordPress-15 height=233
 
Note : อีกวิธีที่สามารถแสดงเมนูได้คือ ให้แสดงที่ Widgets (Sidebar,ด้านข้าง)
How to create navigation menus for WordPress-18 height=295

โดยไปที่ เมนู Appearance >>> Widgets
และคลิกซ้ายค้าง แล้วลากไปที่เมนู Sidebar ตามภาพและ Save เรียบร้อยแล้วครับ

credit: http://www.wpsmile.com/how-to-create-navigation-menus-for-wordpress.html
« แก้ไขครั้งสุดท้าย: 26 สิงหาคม 2016, 01:22:57 โดย smf »