เมนูเมก้าที่แท้จริงในตัวสร้างออกซิเจน

เผยแพร่แล้ว: 2022-04-10

ในบทความนี้ เราจะมาดูวิธีการสองสามวิธีในการเพิ่มเมนู mega "ของจริง" ให้กับ Oxygen Builder ส่วนประกอบเมนูในตัวนั้นดีสำหรับเมนูทั่วไปเมื่อสร้างส่วนหัวด้วย Oxygen แต่ถ้าคุณต้องการฟังก์ชัน megamenu ที่แท้จริง คุณควรมองหาที่อื่น

Stripe.com เป็นไซต์โปรดของเราเสมอเมื่อพูดถึงตัวอย่าง Mega Menu

ในบทความนี้ เราจะพูดถึงวิธีการเพิ่มเมนู mega ใน Oxygen

เมนูเมก้าคืออะไร?

หากคุณเคยใช้เมนูบนเว็บไซต์ที่มีบางอย่างมากกว่าลิงก์ นั่นคือสิ่งที่ megamenu เป็น ความซับซ้อนแตกต่างกันไปตั้งแต่ไอคอนรูปภาพธรรมดาไปจนถึงพื้นที่ที่มีการเติมแบบไดนามิก

พวกเขาสามารถมีเค้าโครงแบบคอลัมน์เดียว เค้าโครงหลายคอลัมน์ หลายแถว ที่เก็บถาวรสำหรับก่ออิฐ และอื่นๆ แน่นอน คุณไม่ต้องการที่จะซับซ้อน เพราะนั่นคือสิ่งที่เพจมีไว้สำหรับ

หากทำอย่างถูกต้อง พวกเขาจะทำให้การนำทางของเว็บไซต์ง่ายขึ้นสำหรับผู้เยี่ยมชมของคุณ

คู่มือสำหรับผู้เริ่มต้นใช้งาน: 2 วิธีง่ายๆ ในการสร้าง WordPress Mega Menu
เมนูเมก้าอเมซอน

Oxygen ช่วยให้คุณสร้างเมนูดรอปดาวน์แบบง่าย ๆ ได้ แต่เมื่อพูดถึงฟังก์ชันของเมนูเมนู คุณจะมีตัวเลือกไม่มากนัก

วิธีเพิ่มเมนูเมก้าในออกซิเจน

บทความนี้จะกล่าวถึงสองวิธีหลักในการเพิ่ม megamenu ให้กับ Oxygen วิธีแรกสามารถทำได้อย่างสมบูรณ์ใน Oxygen โดยไม่ต้องใช้โปรแกรมเสริมของบุคคลที่สาม เหมาะสำหรับเมนูง่ายๆ เป็นไปตามขั้นตอนจากบทช่วยสอนที่เผยแพร่โดยทีมอย่างเป็นทางการที่อยู่เบื้องหลัง Oxygen นี่เป็นวิธีการที่พวกเขาใช้ในการสร้างรายการแบบเลื่อนลงที่เห็นในไซต์ Oxygenbuilder.com

เมนูเมก้าของ Oxygen โดยใช้ "วิธีการแบบแมนนวล"

ตัวเลือกที่สองใช้ปลั๊กอินของบุคคลที่สามซึ่งช่วยให้คุณมีฟังก์ชันการทำงานมากขึ้นเมื่อเป็นเมนูเด่นใน Oxygen Builder หากคุณต้องการสร้างเมนูแบบหลายคอลัมน์ที่มีข้อมูลแบบไดนามิก นี่คือทางออกที่ดีที่สุดของคุณ

แน่นอนว่ามีตัวเลือกเพิ่มเติมที่สามารถใช้ได้หากคุณมีความเข้าใจ HTML, CSS, JavaScript และบางที PHP เป็นอย่างดี อย่างไรก็ตาม นั่นอยู่นอกขอบเขตของบทความนี้ หากคุณคุ้นเคยกับมัน อาจเป็นทางเลือกที่สามที่ดีในการรวมเมนู mega ใน Oxygen ซึ่งไม่ต้องการปลั๊กอินของบุคคลที่สาม

การเพิ่มเมนูเมก้าในออกซิเจนอย่างเป็นธรรมชาติ

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

ในการเพิ่มเมกะนูใน Oxygen คุณต้องสร้างรายการเมนูเริ่มต้นก่อน ไม่ได้ทำกับองค์ประกอบเมนู แต่ทำได้โดยการสร้าง div เติมข้อความและรวมไว้ในลิงก์ สิ่งนี้ค่อนข้างง่ายที่จะทำกับออกซิเจน

เมื่อเมนูเริ่มต้นอยู่ที่นั่นก็ถึงเวลาสร้างเมนูแบบเลื่อนลง

ทำได้โดยการสร้าง div ใต้ลิงก์เมนูซึ่งจะมีเนื้อหาทั้งหมดในเมนูแบบเลื่อนลง เมื่อสร้าง div แบบเลื่อนลงแล้ว (ดูวิดีโอเพื่อทำความเข้าใจโครงสร้างที่แท้จริงเบื้องหลัง) จะถูกวางตำแหน่งอย่างสมบูรณ์และสลับให้มองเห็นได้เมื่อวางเมาส์เหนือลิงก์เมนูที่เกี่ยวข้อง

การใช้งานเมนู mega นี้ค่อนข้างง่าย โดยเฉพาะอย่างยิ่งหากคุณทำตามบทช่วยสอนของ YouTube อนุญาตให้คุณใช้บล็อกใดก็ได้ที่มีใน Oxygen Builder คุณยังสามารถใช้คุณลักษณะการมองเห็นตามเงื่อนไขในตัวเพื่อแสดงและซ่อนสิ่งต่าง ๆ ตามบทบาทของผู้ใช้

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

ขึ้นอยู่กับสาเหตุที่คุณต้องการเพิ่มเมนูเด่นในเว็บไซต์ WordPress ของคุณ (สร้างด้วย Oxygen) คุณอาจต้องการใช้เส้นทางที่สอง

ปลั๊กอินเมนูเมก้าสำหรับออกซิเจน

แทนที่จะเพิ่ม megamenu ด้วยตนเอง การใช้ปลั๊กอินของบุคคลที่สามอาจเป็นทางเลือกที่ดีกว่าในบางกรณี โดยเฉพาะอย่างยิ่งถ้าคุณมีเมนูที่เปลี่ยนแปลงไปมาก ปลั๊กอินสามารถช่วยประหยัดเวลาได้มาก

มีปลั๊กอิน megamenu อยู่มากมาย และเราทดสอบหลายๆ อย่างเมื่อต้องการรวมฟังก์ชันนี้เข้ากับเว็บไซต์ไคลเอนต์ที่สร้างด้วย Oxygen เมื่อค้นหาปลั๊กอิน เกณฑ์ของเราคือต้องใช้งานง่าย ไดนามิก ออกแบบมาอย่างดี และเข้ากันได้กับ Oxygen อย่างสมบูรณ์ (อย่างที่คุณทราบ มีปลั๊กอินจำนวนมากที่ไม่ได้เป็นเช่นนั้น)

จากปลั๊กอินหลายตัวที่เราทดสอบ WP Mega Menu เป็นตัวเลือกที่ดีที่สุดที่ไม่มีปัญหาความเข้ากันได้กับ Oxygen Builder

WP Mega Menu - ปลั๊กอินตัวสร้างเมนู Mega ฟรีที่ยอดเยี่ยมสำหรับ WordPress ...

มีรุ่นฟรีและรุ่นโปร รุ่นโปรราคา $29.00 ต่อปี เวอร์ชันฟรีใช้งานได้ดี แต่มีข้อ จำกัด บางประการเมื่อพูดถึงฟังก์ชันขั้นสูง หากคุณต้องการรวม megamenu ไว้ในเว็บไซต์ไคลเอนต์ที่สร้างด้วย Oxygen Builder เวอร์ชัน Pro น่าจะเป็นทางออกที่ดีที่สุดของคุณ

เราชอบปลั๊กอินนี้เพราะไม่เพียงแค่ใช้งานง่าย แต่ลูกค้าของเราสามารถอัปเดตได้อย่างรวดเร็วโดยไม่ทำลายเว็บไซต์ทั้งหมดของเราที่สร้างด้วย Oxygen มีอินเทอร์เฟซแบบลากและวางที่เรียบง่าย และมาพร้อมกับวิดเจ็ตที่สร้างไว้ล่วงหน้า โดยพื้นฐานแล้ว มันคือ "ตัวสร้างเมนู"

นอกจากนี้ยังตอบสนองซึ่งเป็นปัญหาใหญ่เมื่อใช้วิธีที่หนึ่งเพื่อเพิ่ม megamenu ในเว็บไซต์ Oxygen Builder ของคุณ

หลังจากติดตั้งปลั๊กอินบนเว็บไซต์ของคุณแล้ว การรวมเข้ากับเว็บไซต์ของคุณนั้นทำได้ค่อนข้างง่าย คุณสามารถเลือกให้ปลั๊กอินแทนที่เมนูเริ่มต้น เพิ่มโดยใช้รหัสย่อ หรือใช้ข้อมูลโค้ด PHP เราจะรวมมันเข้าด้วยกันโดยใช้ PHP ทำได้ง่ายใน Oxygen เพียงเพิ่มองค์ประกอบบล็อกโค้ดแล้ววางใน PHP ต่อไปนี้ (แทนที่ ID ด้วย ID ตัวเลขของเมนูของคุณ)

<?php wp_megamenu( array ( 'menu' => 'ID' )); ?>
ภาษารหัส: HTML, XML ( xml )

คุณสามารถวางไว้ที่ใดก็ได้ แต่เราขอแนะนำให้ใช้เทมเพลตส่วนหัวและส่วนท้ายของ catchall ความกว้างของบล็อกโค้ดจะส่งผลต่อตัวเมนู ดังนั้นตรวจสอบให้แน่ใจว่าคุณได้ตั้งค่าให้กว้างเพียงพอสำหรับเนื้อหา

เมนูวางบนไซต์ออกซิเจนสาธิตภายใน 20 วินาที

การสร้างเมนูเมก้านั้นค่อนข้างง่าย เมื่อใช้ตัวสร้างภาพ คุณสามารถลากและวางองค์ประกอบลงบนเลย์เอาต์ของแถว/คอลัมน์ที่ตั้งค่าไว้ได้

มีฟังก์ชันขั้นสูงบางอย่างในปลั๊กอินนี้ เช่น การค้นหาแบบเต็มหน้าจอ วิดเจ็ตแบบไดนามิก และอื่นๆ หากคุณกำลังมองหาวิธีง่ายๆ ในการเพิ่ม megamenu ลงในเว็บไซต์ Oxygen ของคุณ นี่คือทางออกที่ดีที่สุดของคุณ

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

บทสรุป

บทความนี้ควรครอบคลุมสองวิธีที่คุณสามารถใช้เพื่อเพิ่มเมนู mega ในเว็บไซต์ Oxygen Builder ของคุณได้อย่างง่ายดาย เมนูเมก้าสามารถเพิ่มฟังก์ชันการทำงานและทำให้เว็บไซต์ของคุณมีความรู้สึกระดับพรีเมียม การเพิ่ม 1 โดยใช้ CSS และส่วนประกอบออกซิเจนเริ่มต้นค่อนข้างง่าย คุณยังสามารถใช้ปลั๊กอินของบุคคลที่สามเพื่อเพิ่ม megamenu ให้กับ Oxygen

หากคุณมีคำถามใด ๆ ทิ้งไว้ในส่วนความคิดเห็นด้านล่าง!

สมัครสมาชิก & แชร์
หากคุณชอบเนื้อหานี้ สมัครรับข่าวสาร WordPress แรงบันดาลใจเว็บไซต์ ข้อเสนอสุดพิเศษและบทความที่น่าสนใจทุกเดือนของเรา
ยกเลิกการสมัครได้ตลอดเวลา เราไม่สแปมและจะไม่ขายหรือแบ่งปันอีเมลของคุณ