เคล็ดลับ เคล็ดลับและปลั๊กอินที่ดีที่สุดสำหรับการปรับแต่งเมนู WordPress
เผยแพร่แล้ว: 2018-04-04เมนูเป็นส่วนที่สำคัญที่สุดของทุกเว็บไซต์ พวกเขาอยู่ทั่วไปทุกหนทุกแห่งและแนะนำผู้ใช้ผ่านบล็อกของคุณ และในขณะที่การเพิ่มเมนูการนำทางใน WordPress นั้นค่อนข้างง่าย แต่ก็ยังมีอีกมากที่คุณสามารถทำได้เพื่อปรับแต่งสำหรับเว็บไซต์ของคุณ
ไม่ว่าจะเป็นไอคอนขนาดเล็กที่คุณต้องการให้มีบนเมนูหรือคุณต้องการให้ระบบที่แตกต่างไปจากเดิมอย่างสิ้นเชิงเพื่อจัดการกับมัน คู่มือนี้มีทุกอย่าง ดูเคล็ดลับ กลเม็ด และปลั๊กอินเมนูที่ดีที่สุดบางส่วนที่เราเตรียมไว้สำหรับคุณในคู่มือนี้:
- เพิ่มไอคอนในเมนู WordPress ของคุณ
- เพิ่มปุ่มเข้าสู่ระบบ/ออกจากระบบไปยังเมนู
- แสดงเมนู WordPress ได้ทุกที่ที่คุณต้องการ
- วิธีเพิ่มช่องค้นหาในเมนู WordPress ของคุณ
- วิธีทำให้เมนูนำทางติดด้านบนของหน้า
- สร้างเมนูนำทางด้วยปลั๊กอิน
- วิธีลบรายการเมนูระดับบนสุดใน WordPress
- ปลั๊กอินเมนูยอดนิยม 4 อันดับแรกสำหรับ WordPress
- สุดยอดปลั๊กอินเมนูมือถือ WordPress
เพิ่มไอคอนในเมนู WordPress ของคุณ
การสร้างเมนูใน WordPress นั้นง่ายกว่าที่เคย สิ่งที่คุณต้องทำคือสร้างเพจและเพิ่มหน้าเพจข้างโฮมเพจของคุณ เมนูการนำทางหลักของคุณจะเสร็จสิ้นด้วยการคลิกเพียงไม่กี่ครั้ง แต่อาจดูธรรมดามาก
มีปลั๊กอินมากมายที่สามารถช่วยคุณในการสร้างเมนูการนำทางที่สวยงามตระการตา แน่นอน คุณสามารถเขียนโค้ดด้วยตัวคุณเองได้หากคุณรู้วิธี แต่มีวิธีที่ง่ายกว่าในการทำให้เมนูปกติของคุณใช้งานง่ายขึ้น - โดยการเพิ่มไอคอน
ไอคอนกลายเป็นสิ่งที่เราขาดไม่ ได้ เมื่อคุณค้นหาบางสิ่งในแดชบอร์ด WordPress บนเดสก์ท็อป หรือบนสมาร์ทโฟนและแท็บเล็ต คุณอาจเคยชินกับการใช้ไอคอน หลังจากใช้แอปพลิเคชั่นใหม่เพียงไม่กี่ครั้ง คุณมักจะจำไอคอนของไอคอนได้มากกว่าข้อความคำอธิบายทั้งหมดที่มาพร้อมกับมัน เหตุใดคุณจึงไม่วางไอคอนไว้ข้างรายการเมนูและให้ผู้อื่นสำรวจไซต์ของคุณอย่างง่ายดาย
ไอคอนเมนู
ราคา: ฟรี
หากคุณไม่ทราบวิธีดำเนินการ ไม่ต้องกังวล นั่นคือเหตุผลที่คุณมาที่นี่ ในส่วนนี้ของคู่มือ เราจะไม่รบกวนคุณด้วยการเขียนโค้ดแบบกำหนดเอง แต่ เราจะแสดงปลั๊กอินฟรีให้คุณ ซึ่งคุณสามารถกำหนดค่าได้ในอีกไม่กี่นาที ข้างหน้า
- ไปที่ Plugins->Add New
- ค้นหา "ไอคอนเมนู"
- ติดตั้งและเปิดใช้งานปลั๊กอิน
- ไปที่ ลักษณะที่ปรากฏ -> เมนู
- เปิดเมนูการนำทางของคุณ
- เลือกหน้าภายใต้โครงสร้างเมนูที่คุณต้องการเลือกไอคอน
- เลือกไอคอน แก้ไขตำแหน่งและขนาด
- บันทึกเมนู
แค่นั้นแหละ! ไปค้นหาไอคอนเจ๋ง ๆ ที่คุณต้องการบนเมนูแล้วสนุกไปกับการออกแบบใหม่ของคุณ ขณะที่คุณยังคงใช้งานไอคอนอยู่ อย่าลืมว่าคุณสามารถเพิ่ม favicon ในบล็อก WordPress ของคุณได้เช่นกัน
เพิ่มปุ่มเข้าสู่ระบบ/ออกจากระบบไปยังเมนู
หนึ่งในคุณสมบัติมากมายของ WordPress ที่เราชื่นชอบคือวิธีง่ายๆ ในการลงทะเบียนผู้ใช้ใหม่ การควบคุมบทบาทผู้ใช้ที่แตกต่างกันบนแพลตฟอร์มยอดนิยมไม่ใช่เรื่องง่าย มีบทบาทที่ลงทะเบียนไว้แล้วซึ่งคุณสามารถกำหนดได้ และคุณยังสามารถสร้างบทบาทผู้ใช้ที่กำหนดเองได้มากมายตามความต้องการของไซต์ของคุณ
ในขณะที่การลงทะเบียนนั้นรวดเร็วและง่ายดาย การดูแลผู้ใช้ของคุณอาจเป็นงานหนัก แต่คุณต้องทำทุกอย่างเพื่อสร้างประสบการณ์บนเว็บไซต์ให้ดีที่สุด
สิ่งหนึ่งที่คุณสามารถทำได้สำหรับพวกเขาคือการเปิดใช้งานวิธีง่ายๆ ในการเข้าสู่ระบบและออกจากระบบจากไซต์ของคุณ หากต้องการให้ลิงก์เข้าสู่ระบบ/ออกจากระบบอยู่ในมือของผู้ใช้เสมอ คุณสามารถใส่ลิงก์เหล่านั้นลงในเมนูหลักของคุณได้ อย่างแรก การ มีลิงก์เหล่านั้นในเมนูนั้นมีประโยชน์อย่างมาก และประการที่สอง ผู้ใช้ของคุณอาจคุ้นเคยกับคุณลักษณะนี้ จากแอปพลิเคชันอื่นๆ ที่ใช้วิธีการเข้าสู่ระบบและออกจากระบบแบบเดียวกัน
ในกรณีนี้ ไม่จำเป็นต้องคว้าปลั๊กอินอื่น ฟังก์ชัน WordPress อย่างง่ายที่เราจะแสดงให้คุณเห็นในส่วนนี้ของบทความสามารถทำงานได้ดีสำหรับคุณ มันจะวางลิงค์ที่ถูกต้องบนเมนูของคุณโดยอัตโนมัติ นั่นหมายความว่าในขณะที่ผู้ใช้ออกจากระบบ เขาจะได้รับลิงก์ "เข้าสู่ระบบ" และในทางกลับกัน ทั้งคุณและผู้ใช้จะไม่ต้องกังวลกับปุ่มเข้าสู่ระบบอีกต่อไป
หากคุณพร้อมที่จะเพิ่มคุณลักษณะการเข้าสู่ระบบที่เรียบง่ายแต่เรียบร้อยลงในเมนู สิ่งที่คุณต้องทำมีดังนี้:
- เปิด functions.php
- คัดลอกและวางสิ่งต่อไปนี้:
ฟังก์ชั่น add_login_logout_link($items, $args) { $loginoutlink = wp_loginout('index.php', เท็จ); $items .= '<li>' $loginoutlink .'</li>'; ส่งคืนสินค้า $; } add_filter('wp_nav_menu_items', 'add_login_logout_link', 10, 2);
- บันทึกการเปลี่ยนแปลง
เช่นเดียวกับข้อมูลโค้ดส่วนใหญ่ของเรา คุณทำได้ง่ายๆ โดยการคัดลอกและวางฟังก์ชันลงในไฟล์ เมื่อเสร็จแล้ว คุณสามารถโหลดหน้าแรกซ้ำได้ เนื่องจากคุณยังคงเข้าสู่ระบบอยู่ คุณจะได้รับลิงก์ "ออกจากระบบ" ที่จุดสุดท้ายของเมนูหลักของคุณ อย่าลืมตรวจสอบฟังก์ชันทั้งหมด ดังนั้นลองออกจากระบบและกลับเข้ามาใหม่เพื่อให้มั่นใจว่าทุกอย่างเรียบร้อยดี
เมื่อคุณใช้ฟีเจอร์เล็กๆ น้อยๆ นี้เสร็จแล้ว อย่าลืมว่าคุณสามารถเปลี่ยนเส้นทางผู้ใช้ไปยังหน้าอื่นหลังจากลงชื่อเข้าใช้สำเร็จ หรือแม้แต่แสดงเนื้อหาเฉพาะกับผู้ใช้ที่เข้าสู่ระบบหรือออกจากระบบเท่านั้น
นอกจากนี้ เมื่อคุณมีเมนูแบบกำหนดเองแล้ว คุณอาจสนใจที่จะแสดงเมนูนั้นที่ใดก็ได้บนไซต์โดยระบุรหัสย่อที่กำหนดเอง
เราชอบที่จะปรับแต่ง WordPress ด้วยตัวอย่างเล็กๆ น้อยๆ แบบนี้ แล้วคุณล่ะ?
แสดงเมนู WordPress ได้ทุกที่ที่คุณต้องการ
หลังจาก WordPress มาถึงเวอร์ชัน 3.0 หลายสิ่งหลายอย่างก็ใช้งานง่ายขึ้น ในบรรดาคุณสมบัติใหม่ที่แตกต่างกัน การสร้างเมนูการนำทางกลายเป็นเรื่องง่ายสำหรับทุกคน และวันนี้ทุกคนสามารถสร้างเมนูของตนเองได้ด้วยการคลิกปุ่มเมาส์เพียงไม่กี่ครั้ง
ในขณะที่สร้างเมนูที่คุณสามารถเชื่อมโยงโพสต์ หน้า หมวดหมู่ หรือลิงก์ภายนอกใดๆ ได้อย่างง่ายดายนั้นเป็นเรื่องง่าย การ แสดงเมนูในที่ต่างๆ ในไซต์ของคุณอาจเป็นเรื่องเล็กน้อย สำหรับผู้ที่ไม่ได้มีส่วนร่วมในการพัฒนา WordPress
ขึ้นอยู่กับธีมของ WordPress ที่คุณใช้อยู่ คุณสามารถแสดงเมนูที่สร้างขึ้นใหม่ได้อย่างง่ายดายที่ด้านบนของหน้า ซึ่งเราใช้เพื่อค้นหาการนำทางทั้งหมด คุณอาจมีตัวเลือกในการวางเมนูของคุณบนแถบด้านข้างหรือลงในพื้นที่ส่วนท้าย แต่ถ้าคุณต้องการแสดงเมนูในโพสต์ หน้า หรือแม้แต่ในวิดเจ็ตล่ะ
ไม่ คุณไม่จำเป็นต้องสร้างรายการที่กำหนดเองหรือพิมพ์โค้ด HTML ใหม่ทั้งหมดเพื่อทำซ้ำลิงก์ คุณสามารถใช้ประโยชน์จากรหัสย่อและวางเมนูที่มีอยู่ได้ทุกที่ที่คุณต้องการ!
ในบรรทัดต่อไปนี้ เราจะแสดงให้คุณเห็นว่าต้องทำอย่างไร และเรามั่นใจว่าคุณจะชอบคุณสมบัติ 'เมนูในรหัสย่อ' ใหม่ของคุณ
สร้างรหัสย่อและแสดงเมนู WordPress ได้ทุกที่ที่คุณต้องการ
- เปิดไฟล์ functions.php
- คัดลอกและวางรหัสที่จะลงทะเบียนรหัสย่อ:
ฟังก์ชัน menu_function($atts, $content = null) {
สารสกัด(
shortcode_atts(
array( 'name' => null, ),
$atts
)
);
กลับ wp_nav_menu(
อาร์เรย์ (
'menu' => $name,
'echo' => false
)
);
}
add_shortcode('เมนู', 'menu_function');
- บันทึกการเปลี่ยนแปลง
หลังจากที่คุณบันทึกการเปลี่ยนแปลง คุณจะสามารถแสดงเมนู WordPress ได้ทุกที่ที่คุณต้องการ สิ่งที่คุณต้องทำคือจดรหัสย่อ ที่คุณต้องระบุชื่อเมนูที่คุณจะใช้:
[ชื่อเมนู=”เมนูหลัก”]
ในกรณีส่วนใหญ่ เมนูหลักของคุณจะมีชื่อ "เมนูหลัก" ติดอยู่กับตัวมันเอง แต่ถ้าคุณจะใช้เมนูอื่น ให้ป้อนชื่อเมนูในรหัสย่อ คุณไม่จำเป็นต้องรู้ชื่อทุกเมนูด้วยใจ ให้ไปที่ Appearance -> Menus และเรียกดูรายการเมนูหรือสร้างรายการใหม่แทน
เนื่องจากตอนนี้คุณสามารถแสดงเมนู WordPress ได้ทุกที่ คุณสามารถสร้างการนำทางมากมายที่คุณจะใช้บนเว็บไซต์ที่ขับเคลื่อนด้วย WordPress ของคุณ คุณสามารถมีหนึ่งในโพสต์ อีกอันในไฟล์เทมเพลต วิดเจ็ตข้อความ ฯลฯ
วิธีเพิ่มช่องค้นหาในเมนู WordPress ของคุณ
เว้นแต่คุณจะลบคุณลักษณะนี้ WordPress จะช่วยให้ผู้เข้าชมสามารถค้นหาทั่วทั้งไซต์ของคุณได้ เราได้กล่าวถึงคุณสมบัติเจ๋ง ๆ นี้หลายครั้งและแสดงให้คุณเห็นถึงสิ่งต่าง ๆ ที่คุณสามารถทำได้กับหน้าการค้นหาของคุณ ตัวอย่างเช่น คุณสามารถเปลี่ยนเส้นทางผู้ใช้ไปยังโพสต์ได้อย่างง่ายดาย หากพบผลลัพธ์เพียงรายการเดียวหรือตั้งค่าการค้นหาโดย Google ที่กำหนดเอง
หากคุณเรียกดูผ่านวิดเจ็ต WP มาตรฐาน คุณอาจเห็นว่า มีวิดเจ็ตการค้นหาที่พร้อมสำหรับวางบนแถบด้านข้าง แต่ถ้าคุณต้องการให้ช่องค้นหาของคุณปรากฏถัดจากเมนูของคุณแทนล่ะ
ในบรรทัดต่อไปนี้ เราจะแสดงฟังก์ชันที่จะนำช่องค้นหาประจำวันของคุณมาใส่ในเมนูการนำทาง
เพิ่มช่องค้นหาในเมนู:
- เปิด functions.php
- คัดลอกและวางสิ่งต่อไปนี้:
add_filter( 'wp_nav_menu_items', 'add_search_box', 10, 2 ); ฟังก์ชั่น add_search_box( $items, $args ) { $items .= '<li>' get_search_form( เท็จ ) '</li>'; ส่งคืนสินค้า $; }
- บันทึกการเปลี่ยนแปลง
เพื่อให้แน่ใจว่าโค้ดจะใช้ได้สำหรับคุณ ตรวจสอบให้แน่ใจว่าคุณได้เพิ่มเมนูการนำทางลงในไซต์ของคุณแล้ว
โค้ดนี้ค่อนข้างเรียบง่ายและมีฟังก์ชันเดียวคือเพิ่มช่องค้นหาในเมนูการนำทางของคุณ เป็นไปได้มากว่าช่องค้นหาของคุณจะไม่อยู่ในตำแหน่งที่คุณต้องการ นั่นหมายความว่าคุณจะต้องบอก WordPress ว่าจะวางช่องค้นหาไว้ที่ใด:
- เพิ่มคลาสให้กับแท็ก <li> ที่พบในโค้ดบรรทัดที่สาม:
$items .= '<li class=”searchbox-position”>' get_search_form( เท็จ ) '</li>'
- บันทึกการเปลี่ยนแปลง
- เปิด style.css
- คัดลอกและวางโค้ด CSS:
.searchbox-ตำแหน่ง {
ขอบบน: 15px;
ระยะขอบขวา: 20px;
}
- เปลี่ยนรหัสตามใจชอบ
- บันทึกการเปลี่ยนแปลง
หวังว่าคุณจะวางกล่องไว้ข้างเมนูของคุณอย่างสมบูรณ์แบบ ไม่ต้องใช้เวลามากในการใส่กล่องที่คุณต้องการ อย่าลืมจัดรูปแบบช่องค้นหาและเพลิดเพลินกับคุณลักษณะนี้
หากคุณต้องการควบคุมเมนูและช่องค้นหาให้มากขึ้น โปรดดูวิธีเพิ่มไอคอนในเมนูและวิธีเพิ่มตัวเลือกการค้นหาด้วยเสียงสำหรับผู้เข้าชมที่ต้องการกำหนดข้อความค้นหา คุณยังทำได้อีกมากมายทั้งกับเมนูและตัวเลือกการค้นหา ดังนั้นให้ทดสอบช่องค้นหาของเราและเรียนรู้สิ่งใหม่
วิธีทำให้เมนูนำทางติดด้านบนของหน้า
คุณอาจเคยเห็นเว็บไซต์ที่ เมนูการนำทางติดอยู่ที่ด้านบนของหน้าและติดตามคุณทุกย่างก้าวในการผจญภัยแบบเลื่อนลอยของคุณ ฟีเจอร์นั้นอาจเป็นสิ่งที่คุณต้องการบนเว็บไซต์ WordPress ของคุณ และในคู่มือนี้ เราจะแสดงวิธีสร้างฟีเจอร์ให้คุณ
ไม่เพียงแต่มีด้านการใช้งานที่เมนูพร้อมเสมอในมือคุณเท่านั้น แต่ยังดูสวยงามและลื่นไหลอีกด้วย
หากคุณมีความรู้เกี่ยวกับ CSS บ้าง คุณจะไม่มีปัญหาในการทำให้เมนูของคุณติดหนึบ คุณต้องเพิ่มโค้ดลงในไฟล์ Style.css ของคุณเท่านั้น จากนั้นจึงจะเพลิดเพลินไปกับคุณสมบัติเมนูใหม่ได้
- เปิดสไตล์ชีตของคุณ (style.php)
- ค้นหา . nav-menu หรือ . genesis-nav-menu (หรือคล้ายกัน ขึ้นอยู่กับธีมที่คุณใช้)
- ใช้รหัสต่อไปนี้สำหรับคอนเทนเนอร์เมนูหลักของคุณ:
.nav-เมนู {
ตำแหน่ง:คงที่;
พื้นหลัง: #333;
ด้านบน: 0px;
ขวา: 0px;
ซ้าย: 0px;
ดัชนี z:99;
}
อย่างที่คุณเดาได้จากโค้ด ส่วนสำคัญจะอยู่ที่บรรทัดที่สองที่คุณต้องแก้ไขตำแหน่งของเมนู หลังจากนั้น คุณสามารถตั้งค่าองค์ประกอบด้านบน ด้านขวา และด้านซ้ายเป็น 0 พิกเซล หรือย้ายไปยังระยะใดก็ได้จากด้านบนหรือจากขอบด้านซ้ายและด้านขวาของหน้า (เช่น top: 10px จะวางเมนู 10 พิกเซลจาก ระยะขอบบนสุดของไซต์ของคุณ)
- อัปเดตไฟล์ของคุณและเพลิดเพลินกับเมนูการนำทางที่ติดหนึบของคุณ
หากคุณไม่ชอบยุ่งกับโค้ด คุณสามารถใช้ปลั๊กอินเพื่อทำให้เมนูของคุณติดหนึบ
สร้างเมนูนำทางด้วยปลั๊กอิน
เราสอนวิธีสร้างเมนูนำทางแบบติดหนึบโดยการเปลี่ยนบรรทัดของโค้ด CSS ในธีมของคุณ แต่ไม่ว่าจะง่ายแค่ไหน ทุกคนก็ไม่ชอบดูไฟล์ WordPress และแก้ไขโค้ดด้วยตนเอง หากคุณเป็นคนประเภทนั้นหรือต้องการควบคุมเมนูมากขึ้น ไม่ต้องกังวล คุณสามารถตั้งค่าเมนูของคุณและทำให้เหนียวได้โดยใช้ปลั๊กอิน ในส่วนนี้ของบทความนี้ เราจะนำเสนอสิ่งที่ดีที่สุดบางส่วนให้คุณเห็น
UberMenu ส่วนขยายติดหนึบ
ราคา: $8
UberMenu Sticky Extension เป็นโปรแกรมเสริมสำหรับปลั๊กอิน UberMenu ซึ่งหมายความว่าคุณต้องติดตั้งปลั๊กอินนี้ก่อนเพื่อให้ส่วนขยายทำงานได้ ส่วนขยายทำให้ทุกอย่างง่ายขึ้น หลังจากการติดตั้ง คุณก็พร้อมที่จะทำให้เมนูของคุณติดหนึบ ไม่ว่าคุณจะวางเมนูไว้ที่ใด เมื่อผู้ใช้เริ่มเลื่อน เมนูจะติดอยู่ที่ด้านบนของหน้า และทำให้เข้าถึงได้ง่าย
เพื่อให้แน่ใจว่าผู้ใช้มือถือสามารถเข้าถึงทุกส่วนของเมนูได้ ตัวเลือกติดหนึบจะหายไปเมื่อตรวจพบอุปกรณ์มือถือ ไม่มีอะไรให้เพิ่มมากนัก – ดูการสาธิตบนเว็บไซต์อย่างเป็นทางการ และหากคุณมี UberMenu อยู่แล้ว ก็ทำให้เมนูของคุณติดหนึบ
myStickymenu
ราคา: ฟรี – สาธิต
ปลั๊กอินนี้ออกแบบมาเพื่อใช้กับธีม Twenty Thirteen แต่ถ้าคุณปรับแต่งเล็กน้อย คุณสามารถใช้มันกับธีมใดก็ได้ที่คุณชอบ โดยค่าเริ่มต้น จะใช้คลาส CSS การนำทางของธีม “.navbar” ดังนั้นหากคุณต้องการใช้กับธีมอื่น คุณต้องค้นหาคลาสที่ธีมของคุณใช้ เพื่ออธิบายเมนูการนำทางและเปลี่ยนชื่อของคลาสนั้น
หากธีมของคุณเป็นแบบตอบสนอง ปลั๊กอินก็จะตอบสนองด้วย หากคุณต้องการแก้ไขเพิ่มเติม คุณสามารถป้อนสไตล์ CSS ที่กำหนดเองและทำให้เมนู Sticky ของคุณเป็นส่วนตัวมากยิ่งขึ้น
เมนูเหนียว (หรืออะไรก็ได้!) บน Scroll
ราคา: ฟรี
ปลั๊กอินนี้จะช่วยให้คุณสามารถวางเมนูของคุณไว้ด้านบนและทำให้เหนียว ไม่เพียงเท่านั้น ปลั๊กอินยังช่วยให้คุณสร้างองค์ประกอบที่ติดหนึบได้ เพียงแค่ค้นหาตัวเลือกที่ถูกต้อง สำหรับองค์ประกอบนั้น นั่นหมายความว่าคุณสามารถทำให้โลโก้ของคุณหรือแม้แต่ส่วนหัวทั้งหมดติดอยู่ที่ด้านบนของหน้าในขณะที่ผู้ใช้เลื่อนดูเว็บไซต์ของคุณ เพื่อให้ทุกอย่างใช้งานได้ คุณจะต้องรู้เล็กน้อยเกี่ยวกับ HTML และ CSS เพื่อให้คุณสามารถหาตัวเลือกที่เหมาะสมได้
วิธีลบรายการเมนูระดับบนสุดใน WordPress
คุณอาจรู้อยู่แล้วว่า WordPress นั้นปรับแต่งได้สูง หากคุณรู้วิธีเขียนโค้ดหรืออย่างน้อยก็พบปลั๊กอินที่เหมาะสม คุณสามารถเปลี่ยนแบ็กเอนด์และฟรอนท์เอนด์และแสดงเว็บไซต์ที่ไม่ซ้ำใครให้กับผู้เยี่ยมชมและผู้เขียนของคุณได้เช่นกัน
ในส่วนนี้ เราจะแสดงโค้ดง่ายๆ ที่จะช่วยให้คุณสามารถลบรายการเมนูระดับบนสุดออกจากหน้าผู้ดูแลระบบ WordPress ของคุณได้
รหัสที่คุณพบด้านล่างจะลบรายการเมนูระดับบนสุดทั้งหมดให้กับผู้ใช้ทั้งหมด แทนที่จะเป็นผู้ดูแลระบบ ก่อนที่คุณจะดำเนินการต่อ คุณควรทราบว่าข้อมูลโค้ดนี้จะลบเฉพาะรายการเมนู แต่รายการเหล่านั้นจะยังปรากฏต่อผู้ที่ทราบเส้นทางที่ถูกต้องไปยังหน้าการตั้งค่า หากคุณต้องการจำกัดการเข้าถึงหน้าเมนูบางหน้าโดยสมบูรณ์ คุณจะต้องเปลี่ยนความสามารถของผู้ใช้
ลบรายการเมนูระดับบนสุด:
- เปิดไฟล์ functions.php ของคุณ
- คัดลอกและวางรหัสต่อไปนี้:
ถ้า (!current_user_can( 'manage_options' )) { add_action( 'admin_menu', 'my_remove_menus', 999 ); } ฟังก์ชั่น my_remove_menus() { remove_menu_page( 'index.php' ); //แผงควบคุม remove_menu_page( 'edit.php' ); //โพสต์ remove_menu_page( 'upload.php' ); //สื่อ remove_menu_page( 'edit.php?post_type=page' ); //หน้า remove_menu_page( 'แก้ไขความคิดเห็น.php' ); //ความคิดเห็น remove_menu_page( 'themes.php' ); //รูปร่าง remove_menu_page( 'plugins.php' ); // Plugins remove_menu_page( 'users.php' ); //ผู้ใช้ remove_menu_page( 'tools.php' ); //เครื่องมือ remove_menu_page( 'options-general.php' ); //การตั้งค่า }
- บันทึกการเปลี่ยนแปลง
เนื่องจากโค้ดนี้จะลบเมนูระดับบนสุดทั้งหมดซึ่งคุณอาจไม่ต้องการทำ อย่าลังเลที่จะแก้ไขโค้ดตามความต้องการของคุณ แต่ละบรรทัด "remove_menu_page" มีหน้าที่ในการลบหนึ่งหน้า (ซึ่งอธิบายไว้ในวงเล็บเช่นเดียวกับในความคิดเห็นข้างบรรทัดของโค้ด) เพียงเพิ่มหรือลบหน้าที่คุณต้องการให้ไม่อยู่ในเมนูของคุณ และบันทึกการเปลี่ยนแปลงอีกครั้ง
เมื่อคุณได้เรียนรู้วิธีลบหน้าระดับบนสุดออกจากเมนูแล้ว คุณอาจต้องการลบเฉพาะบางหน้าย่อยที่อยู่ใต้หน้าระดับบนสุด
ปลั๊กอินเมนูยอดนิยม 4 อันดับแรกสำหรับ WordPress
เมื่อคุณเริ่มสร้างเว็บไซต์ใหม่แล้ว ไม่ช้าก็เร็ว คุณจะต้องมีเมนู คุณสามารถสร้างมันขึ้นมาโดยใช้ตัวเลือกเมนูมาตรฐานใน WordPress แต่ถ้าคุณต้องการอย่างมืออาชีพมากกว่านี้ คุณจะต้องรู้รหัส HTML และ CSS ของคุณ นั่นก็หมายความว่าคุณจะต้องใช้เวลาส่วนหนึ่งในการออกแบบทุกอย่างให้ทำงานได้อย่างสมบูรณ์แบบและดูสวยงามไปพร้อม ๆ กัน
แต่ถ้าคุณต้องการวิธีแก้ปัญหาที่เร็วกว่าหรือคุณไม่รู้วิธีเขียนโค้ดเมนูแฟนซีของคุณเอง WordPress ให้คุณติดตั้งปลั๊กอินที่ยอดเยี่ยมซึ่งออกแบบมาเพื่อสร้างเมนูที่สวยงามด้วยการคลิกเพียงไม่กี่ครั้ง ต่อไปนี้คือปลั๊กอินเมนูที่ดีที่สุดบางส่วนสำหรับ WordPress หากไม่มีคำสั่งใดเป็นพิเศษ
เมนู Uber
ราคา: $20 – สาธิต
ด้วยยอดขายมากกว่า 43,000 รายการ Uber Menu เป็นหนึ่งในปลั๊กอินยอดนิยมสำหรับ WordPress เมื่อคุณเปิดไซต์สาธิตและดูว่าเมนูที่สร้างด้วยปลั๊กอินนี้เป็นอย่างไร คุณจะเข้าใจว่าทำไมเมนูนี้ถึงได้รับความนิยม และเมื่อคุณเริ่มแสดงคุณลักษณะต่างๆ แล้ว คุณอาจต้องการคุณลักษณะนี้สำหรับตัวคุณเอง
เมนูที่สร้างด้วยเมนู Uber จะตอบสนองและเปิดใช้งานระบบสัมผัสสำหรับผู้เยี่ยมชมมือถือของคุณ คุณสามารถสร้างเลย์เอาต์ที่สวยงามและวางไอคอน รูปภาพ วิดีโอ และแผนที่ลงในเมนูของคุณได้ สามารถวางแบบฟอร์มทั้งหมดลงในเมนูย่อยเพื่อให้คุณสามารถสร้างแบบฟอร์มการติดต่อโดยไม่ต้องเพิ่มหน้าพิเศษ ปลั๊กอินนี้ปรับแต่งได้สูงและคุณสามารถเล่นกับการตั้งค่าสไตล์มากกว่า 50 แบบพร้อมการแสดงตัวอย่างแบบสด คุณสามารถสร้างเมนูย่อยโดยอัตโนมัติจากเนื้อหาอื่นๆ ของคุณ สร้างแท็บภายใต้เมนูของคุณ และอื่นๆ อีกมากมาย
- การสร้างรายการแบบไดนามิก
- เมนูย่อยที่แท็บ
- ปรับปรุงส่วนต่อประสานผู้ใช้
Morph: เมนู WordPress Fly-Out ที่ปรับแต่งได้
ราคา: $20 – สาธิต
Morph เป็นเมนูแบบเลื่อนออกที่ออกแบบมาสำหรับอุปกรณ์พกพา แต่อย่างที่คุณเห็นบนหน้าสาธิตหากคุณเปิดมันบนคอมพิวเตอร์ส่วนบุคคล มันดูดีมากบนเดสก์ท็อปเช่นกัน
โดยใช้ปลั๊กอินนี้ คุณสามารถซ่อนเมนูและเรียกมันออกมาได้ด้วยการคลิกง่ายๆ ในพื้นที่เมนู คุณสามารถสร้างเมนูดรอปดาวน์มาตรฐาน เพิ่มรูปภาพ ปุ่มค้นหา และพื้นที่ทั้งหมดจะถูกปรับแต่งวิดเจ็ต ซึ่งหมายความว่าคุณสามารถฝังสิ่งที่คุณต้องการและต้องการได้ ปลั๊กอินนี้ปรับแต่งได้มาก คุณจึงสามารถเลือกสีที่ต้องการ เปลี่ยนความสูงของรูปภาพ และเพิ่มหรือลบองค์ประกอบต่างๆ ให้เหมาะกับความต้องการของคุณได้ หากคุณกำลังจะใช้สำหรับอุปกรณ์มือถือ คุณสามารถตั้งค่าความละเอียดที่เมนูจะปรากฏขึ้นได้อย่างง่ายดาย
- ใช้งานได้ดีทั้งบนเดสก์ท็อปและอุปกรณ์มือถือ
- เพิ่ม/ลบองค์ประกอบที่ปรับแต่งได้
- สามารถเรียกโดยองค์ประกอบใด ๆ
เมนูฮีโร่
ราคา: 19 เหรียญ – สาธิต
ไม่ว่าคุณจะต้องการเมนูง่ายๆ หรือ "Mega Menu" ที่ซับซ้อน คุณก็สามารถสร้างได้ด้วยปลั๊กอิน Hero Menu ทุกเมนูที่คุณสร้างจะตอบสนองและจะดูดีในทุกอุปกรณ์ หากคุณเลือกสร้างเมนูขนาดใหญ่ รายการต่างๆ สามารถแสดงหรือซ่อนได้ ดังนั้นคุณจึงไม่ต้องกังวลกับเลย์เอาต์บนหน้าจอขนาดเล็ก
มีการรองรับการสัมผัสพิเศษสำหรับ Android, iOS และ Windows Phone เลือกแถบการนำทางแบบเต็มความกว้างหรือความกว้างคงที่ ซึ่งคุณสามารถ เพิ่มองค์ประกอบพิเศษได้ง่ายๆ โดยใช้เทคนิคการลากและวาง มีชุดสีที่ตั้งไว้ล่วงหน้ามากกว่า 60 แบบ และคุณสามารถใช้ Google Fonts แต่ละแบบได้ฟรี ทำให้เมนูติดหนึบ เลือกระยะการเปิดใช้งาน… ปลั๊กอินที่ยอดเยี่ยมนี้สามารถนำเสนอได้มากกว่า ดังนั้นอย่าลืมตรวจสอบรายการคุณสมบัติทั้งหมดใน CodeCanyon
- ตัวสร้างโครงสร้างเมนูลาก&วาง
- สร้างเมนูง่ายๆ หรือเมนูเมก้าที่ซับซ้อน
- การนำทางมือถือพิเศษ
มัลติ-เอ็กซ์ บาร์
ราคา: $16 – สาธิต
แถบ Multi-X เป็นปลั๊กอินแบบแยกส่วน และช่วยให้คุณสามารถวางอะไรก็ได้ที่คุณต้องการลงในแถบนำทาง นอกจากรายการเมนูแล้ว คุณยังสามารถวางรายการบนแถบได้มากถึง 8 รายการ ไม่ว่าจะเป็นแบบฟอร์มการติดต่อ แบบฟอร์มการค้นหา ไอคอนการแบ่งปันทางสังคม พื้นที่วิดเจ็ต ฯลฯ
มีธีมที่แตกต่างกันสองแบบให้คุณเลือก บวกกับธีมที่กำหนดเอง ซึ่งคุณสามารถกำหนดสีของคุณเองได้ในขณะที่การไล่ระดับสีจะถูกคำนวณโดยอัตโนมัติ แถบนำทางสามารถวางเป็นเมนูคงที่หรือเลื่อนได้ หากคุณเป็นนักพัฒนาซอฟต์แวร์ คุณจะอยากทราบว่ามีชุดตะขอพร้อมให้คุณใช้งาน หากคุณต้องการสร้างปลั๊กอินใหม่จากแถบ Multi-X ปลั๊กอินนี้มีประโยชน์มากกว่านั้นมาก ดังนั้นอย่าลืมดูคุณสมบัติทั้งหมดบน CodeCanyon
- 8 โมดูลการทำงานแบบฝังตัว
- ธีม 2 สี + ธีมที่กำหนดเอง
- ตำแหน่งบนหรือล่าง
สุดยอดปลั๊กอินเมนูมือถือ WordPress
เราทุกคนรู้ว่าเทคโนโลยีมาไกลแค่ไหน สมาร์ทโฟนและแท็บเล็ตเป็นสิ่งที่หลีกเลี่ยงไม่ได้และมีเจ้าของอุปกรณ์พกพาเพิ่มขึ้นเรื่อยๆ เครือข่าย WiFi ครอบคลุมทุกส่วนของเมืองของเรา และหากไม่มี คุณสามารถเชื่อมต่ออุปกรณ์มือถือของคุณกับอินเทอร์เน็ตผ่านผู้ให้บริการของคุณ ความหมายทั้งหมดคือจำนวนนักเล่นเว็บบนมือถือนั้นเพิ่มสูงขึ้นกว่าที่เคย และคุณจำเป็นต้องดูแลพวกเขาหากคุณกำลังใช้งานเว็บไซต์
หากคุณกำลังสร้างไซต์บนมือถือหรือต้องการทำให้ดีขึ้น คุณจะต้องสร้างเมนูมือถือพิเศษที่จะปรับให้เข้ากับขนาดหน้าจอใดๆ และช่วยให้ผู้ใช้อุปกรณ์เคลื่อนที่ไปยังส่วนต่างๆ ได้ง่ายขึ้น
ด้วย WordPress งานนี้ไม่ได้ยากอย่างที่คุณคิด คุณไม่จำเป็นต้องรู้วิธีเขียนโค้ดหรือตั้งค่าเมนู สิ่งที่คุณต้องมีคือปลั๊กอินที่คุณสามารถติดตั้งและปรับแต่งตามความต้องการของคุณได้อย่างง่ายดาย
ในส่วนนี้ของคู่มือนี้ เราจะนำเสนอปลั๊กอินพรีเมียมที่ดีที่สุดบางส่วน ซึ่งสามารถสร้างเมนูมือถือสำหรับเว็บไซต์ WordPress ของคุณได้ เลยเลื่อนลงไปดูกันเลย
สัมผัส
ราคา: $18 – สาธิต
ปลั๊กอินพรีเมียมนี้จะสร้างส่วนหัวมือถือที่สะอาดพร้อมเมนูมือถือที่ฝังอยู่ แอนิเมชั่นนั้นเรียบง่ายมากและสามารถดูดีและไหลลื่นบนหน้าจอสมาร์ทโฟน ด้วย Tactile คุณสามารถสร้างเมนูหีบเพลงหลายระดับ สร้างเมนูแนวนอนระดับเดียวที่สามารถปัดหรือสร้างแถบด้านข้างที่มีวิดเจ็ตที่สามารถบินเข้าสู่เว็บไซต์ของคุณ ได้
ทุกอย่างสามารถปรับแต่งได้ ซึ่งหมายความว่าคุณสามารถระบายสีองค์ประกอบของคุณในสีใดก็ได้ที่คุณต้องการ เปลี่ยนพื้นหลัง และตั้งค่าสี ความทึบ และอื่น ๆ อีกมากมาย เมนูของคุณสามารถแก้ไขได้หรือวางตำแหน่งได้อย่างแน่นอน หากคุณต้องการควบคุมอุปกรณ์มือถือให้มากขึ้นไปอีก คุณสามารถตั้งค่าความละเอียดที่จะเปิดใช้งานเมนูนี้ได้
- หลายประเภทเมนู
- ฟังก์ชั่นการค้นหา
- ตำแหน่งคงที่/แน่นอน
TapTap
ราคา: $10 – สาธิต
TapTap จะให้พลังแก่คุณในการสร้างเมนูมือถือที่ไม่ซ้ำใครสำหรับเว็บไซต์ WordPress ของคุณ ดังที่คุณเห็นจากไซต์สาธิต คุณสามารถสร้างเกือบทุกอย่างที่คุณจินตนาการ และเมนูของคุณจะดูเรียบร้อยจริงๆ ด้วยปลั๊กอินนี้ คุณสามารถสร้างเมนูหลายระดับ เลือกองค์ประกอบที่คุณต้องการแสดง เพิ่มคำอธิบาย หรือเปิดใช้งานตัวเลือกการค้นหาแบบบูรณาการ
มีการออกแบบปุ่มเมนูสองแบบและแอนิเมชั่นไม่กี่แบบให้เลือก ตำแหน่งเมนูของคุณสามารถแก้ไขได้หรือคุณอาจใช้ตำแหน่งที่แน่นอน เลือกสไตล์พื้นหลังและเล่นกับตัวเลือกการจัดสไตล์มากมายเพื่อให้คุณสามารถใส่เมนูลงในธีมของคุณได้อย่างสมบูรณ์แบบ สุดท้ายแต่ไม่ท้ายสุด TapTap จะให้คุณเลือกความละเอียดที่จะแสดงเอง คุณต้องการอะไรอีกจากเมนูการนำทางบนมือถือ
- เมนูหลายระดับ
- การออกแบบและแอนิเมชั่นปุ่มเมนู 2 ปุ่ม
- ตำแหน่งคงที่/แน่นอน
โมบิ
ราคา: $16 – สาธิต
Mobi เป็นปลั๊กอิน WordPress ที่เรียบง่ายแต่ยอดเยี่ยมอีกตัวที่พร้อมช่วยเหลือเว็บไซต์บนมือถือ ด้วยการเพิ่มนี้ ธีมที่ตอบสนองของคุณจะมีการนำทางที่ดียิ่งขึ้น เมื่อคุณสร้างเมนูโดยใช้ ตัว สร้างเมนูแบบ ลากและวางที่ใช้งานง่าย คุณสามารถวางไว้ด้านบนหรือด้านล่างของไซต์ของคุณได้
รายการเมนูทั้งหมดสามารถปรับแต่งได้ และคุณสามารถเพิ่มไอคอนโซเชียลมีเดียลงในแถบนำทางของคุณได้ฟรี มีฟอนต์ไอคอนมากกว่า 700 แบบ และคุณสามารถออกแบบให้เสร็จสมบูรณ์ได้โดยใช้หนึ่งใน Google Fonts หากต้องการ คุณสามารถควบคุมการมองเห็นผู้ใช้สำหรับแขกและผู้ใช้ที่เข้าสู่ระบบ
- ลากและวางการปรับแต่ง
- การวางตำแหน่งเมนูบนหรือล่าง
- การมองเห็นผู้ใช้สำหรับแขกและผู้ใช้ที่เข้าสู่ระบบ
Wah-เมนู
ราคา: $44 – สาธิต
เมนู Wah เป็นเมนูที่ เชื่อมต่อได้ อย่างสมบูรณ์แบบสำหรับเว็บไซต์บนมือถือ ออกแบบมาเป็นพิเศษสำหรับการนำทางด้วยการสัมผัสของ iPad ด้วยปลั๊กอินระดับพรีเมียมนี้ คุณสามารถเพิ่มลิงก์เมนูได้มากถึง 8 ลิงก์ ซึ่งจะติดตั้งไว้อย่างดีที่ด้านข้างของเว็บไซต์ WordPress ของคุณ
เมื่อคุณคลิกที่ไอคอนเฉพาะในเมนู เมนูย่อยจะปรากฏขึ้น ซึ่งอนุญาตให้ใช้ HTML วิดีโอแบบฝัง แผนที่ และแทบทุกอย่างที่คุณต้องการ ปลั๊กอินนี้ปรับแต่งได้สูง ซึ่งหมายความว่าคุณสามารถเลือกจาก 8 สีเน้นเสียง เล่นกับความกว้างของเมนู ไอคอน ลิงก์ ฯลฯ การสร้างเมนูทำได้ง่ายมากด้วยโปรแกรมแก้ไขแบบ WYSIWYG ไม่ว่าคุณจะเลือกใช้ธีมสีเข้มหรือสีอ่อน คุณก็สามารถมั่นใจได้ว่ามันจะดูดี
- บรรณาธิการ WYSIWYG
- เมนูย่อยที่รองรับ HTML, วิดีโอแบบฝัง ฯลฯ
- ตัวเลือกสถานะ Out หรือ Docked
เมนูรูปแบบเส้นทาง
ราคา: $12 – สาธิต
ปลั๊กอินพรีเมียมนี้ค่อนข้างแตกต่างจากปลั๊กอินทั่วไปที่ใช้ในการสร้างเมนูโดยเฉพาะ แทนที่จะเป็นแถบเมนูแบบคลาสสิกหรือเมนูแถบด้านข้าง Path Style Menu จะสร้างปุ่ม หลังจากที่คุณเปิดใช้งานปุ่ม ปุ่มจะแสดงเมนูรอบๆ ปุ่มในวงกลม ขยายแบบอินไลน์ในทิศทางที่คุณต้องการ หรือแม้แต่จัดระเบียบไอคอนของคุณในส่วนโค้ง
หากมีหลายระดับของเมนู ปุ่มจะสร้างปุ่มย้อนกลับซึ่งจะทำให้ผู้ใช้สามารถไปที่เมนูหลักได้อีกครั้ง มีตัวเลือกการปรับแต่งมากมายและสร้างเมนู คุณสามารถใช้ตัวแก้ไขเมนูมาตรฐานของ WordPress ได้ง่ายๆ หากคุณกำลังมองหาเมนูมือถือที่ไม่เหมือนใคร ให้โอกาสเมนู Path Style
- สร้างเมนูรอบปุ่ม
- ปรับแต่งได้สูง
- ใช้เมนู WP มาตรฐานในการแก้ไขเมนู
Scrollnav
ราคา: $10 – สาธิต
ปลั๊กอินเมนูพิเศษอีกตัวที่ให้ฟังก์ชันที่ยอดเยี่ยมและดูดีบนเว็บไซต์ของคุณ Scrollnav ประกอบด้วยวงกลมที่มีตัวเลือกเมนู ต่างๆ มีลิงก์ของหน้าแรกอยู่ตรงกลางของปุ่ม ลิงก์บนสุดจะนำคุณไปที่ด้านบนของหน้าอย่างมีเหตุผล มีกล่องค้นหา เมนูแบบกำหนดเอง และส่วนลิงก์แบบกำหนดเองของวงกลม
เมนูที่กำหนดเองจะให้พื้นที่เพียงพอในการสร้างเมนูทั้งหมดด้วยเมนูย่อย ซึ่งจะดูดีและจะให้พื้นที่ที่จำเป็นมากบนเว็บไซต์บนมือถือของคุณ มีชุดสีหลายแบบที่คุณสามารถเลือกได้และทุกอย่างกำหนดค่าได้ง่าย คุณควรตรวจสอบไซต์สาธิตอย่างแน่นอนเพื่อดูว่าปลั๊กอินเล็ก ๆ นี้ทำงานอย่างไร
- ปุ่มวงกลมพร้อมฟังก์ชันต่างๆ
- เมนูที่กำหนดเองและส่วนลิงก์ที่กำหนดเอง
- หลายสี
เลื่อนไปที่เมนู
ราคา: $24 – สาธิต
ปลั๊กอินพรีเมียมแบบเรียบง่ายนี้จะทำให้คุณมีเมนูแถบด้านข้างสุดเจ๋งซึ่งสร้างขึ้นสำหรับการนำทางแบบสัมผัสของ iOS และ Android เมื่อคุณสร้างเมนูแล้ว เมนูจะมีไอคอนที่เชื่อมโยงไปยังส่วนอื่นของหน้าและเลื่อนโดยอัตโนมัติ
สิ่งสำคัญที่ควรทราบ คือ ScrollTo ไม่ใช่เมนูการนำทางแบบเต็ม แต่จะเลื่อนไปยังส่วนอื่นของหน้าเดียวกันเท่านั้น คุณสามารถเลือกจากไอคอนมากกว่า 750 รายการ หรือคุณสามารถใช้รูปภาพของคุณเองเป็นรายการเมนู และมีพื้นที่เพิ่มเติมสำหรับโฆษณา เพื่อให้ทุกอย่างใช้งานได้ คุณจะต้องมีความรู้พื้นฐานเกี่ยวกับ HTML เพื่อที่จะปฏิบัติตามคำแนะนำได้ อาจต้องใช้เวลาอีกสองสามนาที แต่ผลลัพธ์ที่ได้ก็ดูดี
- สัมผัสที่เปิดใช้งาน
- กว่า 750 ไอคอน + ภาพที่กำหนดเอง
- พื้นที่โฆษณาเพิ่มเติม
บทสรุป
เราหวังว่าตอนนี้คุณจะรู้ว่าเป็นการยากที่จะเปิดเว็บไซต์โดยไม่มีเมนู แม้ว่าคุณจะเรียกใช้เพจเจอร์เดียว คุณก็ยังต้องการการนำทางระหว่างส่วนต่างๆ ดังนั้น ในขณะที่คุณอยู่ที่นี่แล้ว ให้ใช้เวลาในการปรับแต่งเมนู WordPress ของคุณและทำให้ดีที่สุด