Plugin WP Mega Menu: chức năng, cài đặt, cấu hình. Menu thả xuống theo chiều ngang Super WordPress Plugin Menu tối đa Mega từng bước

Menu lớn thả xuống- một thiết kế tuyệt vời. Điều hướng Trang web chứa một số lượng lớn các trang luôn là một vấn đề. Các menu kiểu sơ đồ trang tĩnh cổ điển phát triển nhanh chóng khi số lượng trang tăng lên và chiếm nhiều dung lượng. Các menu thả xuống động có thể tiết kiệm đáng kể không gian trang, nhưng tính dễ sử dụng bị hy sinh - cần phải có thao tác chuột hoạt động và khá chính xác để điều hướng. Tôi đã bỏ lỡ một chút và thực đơn sai được tiết lộ.

Sự phát triển của khái niệm mega-menu có lẽ được lấy cảm hứng từ giao diện ribbon của Microsoft Office 2007. Khái niệm này nằm ngay giữa menu tĩnh đơn giản và menu thả xuống động. Một mặt, menu như vậy khá đầy đủ thông tin và trực quan, mặt khác, nó làm giảm đáng kể các thao tác chuột cần thiết. Mở rộng, nó có thể sử dụng tất cả không gian màn hình có sẵn, cho phép người dùng xem tất cả các điểm được cung cấp trong ngữ cảnh này và nếu cần, ẩn đi.

Có thể như vậy, nhưng mega-menu bây giờ, như họ nói, đang có xu hướng và nếu bạn chưa sử dụng nó, thì bạn nên xem xét kỹ hơn.

UberMenu: Plugin WordPress Mega Menu

Plugin đa chức năng này có thể được đặt ở vị trí đầu tiên một cách an toàn trong bài đánh giá này: mega-menu hoàn toàn, có vô số tùy chọn khác nhau đáng kinh ngạc, bao gồm kiểm soát màu nền và phông chữ, kích thước phông chữ, v.v. Và tất cả điều này được thực hiện từ bảng cài đặt mạnh mẽ và dễ sử dụng.

Ngoài ra, menu còn có một số tính năng tuyệt vời khác như:

  • Lưới đáp ứng tích hợp
  • Tùy chỉnh chiều rộng của từng cột và đặt chiều rộng mặc định
  • Kết hợp các mục menu thành nhóm
  • Căn giữa các mục menu trong các đường ngang
  • Hình nền tùy chỉnh
  • Cuộn menu con chứa một số lượng lớn các mục.
Nói chung là một plugin rất mạnh mẽ mà tôi rất khuyên dùng.

Chi phí: $ 19

Menu chính Mega

Một plugin rất phổ biến và được sử dụng rộng rãi Menu chính Mega biết cách giữ cân bằng giữa chức năng và sự đơn giản. Có hơn 10 công cụ khác nhau để bạn sử dụng để tạo menu thả xuống, có thể chứa văn bản, hình ảnh, liên kết và tiện ích con... Thêm vào đó, các tùy chọn màu sắc không giới hạn và hơn 600 phông chữ của Google.

Chi phí: $ 15

Menu Liquida Mega

Menu Liquida Mega là một plugin hiện đại và đa chức năng sẽ phù hợp với cả người dùng thông thường và nhà phát triển - bạn có thể dễ dàng nhúng nó vào chủ đề đang được phát triển của riêng bạn.

Plugin mang lại nhiều cơ hội cho tạo menu với thiết kế hiện đại và phong cách: hướng dọc hoặc ngang, khả năng đưa vào các mục menu liên kết, hình ảnh và thậm chí cả thẻ sản phẩm WooCommerce hoặc Easy Digital Downloads, có thể hữu ích khi phát triển các cửa hàng trực tuyến.

Chi phí: $ 19

Thực đơn Sky mega

Ba thiết kế di động, 9 cách phối màu, lưới tùy chỉnh, hình dạng và biểu tượng 360 vector. Bộ này cho phép Sky Mega Menu có vị trí xứng đáng trong số các loại của họ.

Chi phí: $ 6

Menu WP Mega

Plugin từ danh mục phải có. Nhiều cài đặt và tùy chọn, hoạt động với các danh mục, danh mục phụ và tin nhắn, Tối ưu hóa SEO và hai bảng màu cài sẵn (tối và sáng), tuy nhiên, có thể dễ dàng thay đổi theo ý muốn của bạn.

Chi phí: $ 29

Menu NOO

Để hiểu bảng cài đặt Menu NOO bạn thậm chí không cần phải đọc tài liệu - mọi thứ đều rất trực quan. Với bản xem trước trực tiếp trong tay, bạn có thể chỉ cần thay đổi các giá trị và di chuyển các thanh trượt để xem hiệu ứng. Bảng màu có thể được thay đổi hoàn toàn tùy ý và mỗi tùy chọn có thể được lưu dưới tên riêng của nó, và số lượng tùy chọn này là không giới hạn.

Nội dung của các mục menu có thể văn bản, liên kết, hình ảnh, video, biểu mẫu và các tiện ích khác nhau... Nó sử dụng lưới 12 cột của riêng mình để đáp ứng tất cả những điều này.

Chi phí: $ 15

Hero Menu - Plugin WordPress Mega Menu đáp ứng

Hero Menu cho phép bạn liên kết các liên kết đến bài đăng, danh mục, URL bên ngoài với các mục menu, cũng như hiển thị các bài đăng blog trong đó cùng với hình ảnh nổi bật. Phiên bản mới nhất đã công bố hỗ trợ đầy đủ cho nền tảng WooCommerce. Để thuận tiện cho công việc, nó được tích hợp trình chỉnh sửa kéo và thả.

Thiết kế là hiện đại và phong cách và tất nhiên là hoàn toàn.

Chi phí: $ 19

Superfly - Plugin trình đơn WordPress đáp ứng

Cái gọi là thực đơn bay là xu hướng mới nhất trong thế giới thiết kế web. Một menu như vậy lặng lẽ "đánh số" ở góc của trang dưới dạng một biểu tượng, thực tế không chiếm không gian và khi di chuột con trỏ sẽ mở ra, dịch chuyển các phần tử của trang, thay vì chồng chéo chúng.

Một trong những đại diện của loại mega-menu này là Superfly - Plugin trình đơn WordPress đáp ứng. Một công cụ ấn tượng về cả thiết kế và hiệu suất.

Chi phí: $ 22

Menu chuyển đổi

Với sự phổ biến ngày càng tăng của các thiết bị di động, menu bật lên (hoặc theo ngữ cảnh) đang trở nên quan trọng vì chúng có thể tiết kiệm đáng kể không gian màn hình.

Menu chuyển đổi rất đơn giản thực đơn tối giản tuy nhiên nó vẫn làm rất tốt chức năng chính của nó.

Chi phí: $ 5

WP Floating Menu Pro

WP Floating Menu Pro là một plugin 2 trong 1. Trình đơn điều hướng cho một trang web và dán menu. Hơn nữa: với plugin này, ít nhất bạn có thể chuyển đổi trực quan trang web của mình thành một trang hiện đại. WP Floating Menu Pro sẽ cung cấp khả năng cuộn mượt mà từ phần này sang phần khác của trang.

Theo ý của nhà phát triển, WP Floating Menu Pro cung cấp 13 và 7 bố cục khác nhau trên trang, các tùy chọn tùy chỉnh, màu sắc, nội dung và số lượng mục.
Đối với màn hình có độ phân giải dưới 480px, có một tùy chọn để tự động tắt menu.

Chi phí: $ 17

Flexi Menu WordPress Plugin

Flexi Menu cung cấp 5 loại menu khác nhau, hoàn toàn có thể tùy chỉnh: thực đơn bay, rộng (theo chiều rộng trang), rộng + mô tả, rộng + hình ảnh và dọc.

Chi phí: $ 14

Menu Max Mega (Miễn phí)

Rất tốt plugin với trình chỉnh sửa menu kéo và thả và khả năng nhúng hầu hết mọi tiện ích vào các mục menu - từ biểu mẫu liên hệ đến bản đồ Google.

Có thể tự động chuyển đổi các menu thông thường hiện có thành một menu lớn với toàn quyền kiểm soát quá trình chuyển đổi và lưu hoặc chỉ định lại các hành động thích hợp.

    Điều này có thể được thực hiện bằng cách sử dụng các kiểu.
    Nhưng bạn cần hiểu rằng bạn có Menu thì bạn cần chuyển từ trên xuống Sidebar, cái mà bạn chưa có.
    Đó là, nếu Chủ đề này cho phép, hãy kết nối Thanh bên ở phía bên phải và kéo Menu vào đó.
    Và để làm cho nó thẳng đứng, chỉ cần thêm / thay đổi CSS

    Điều hướng chính ul li, .secondary-điều hướng ul li (display: block! Important;)

    Sau đó, bạn cần phải thay đổi thụt lề và các thuộc tính khác một chút.

    Có lẽ tôi đã hiểu lầm bạn, nhưng menu Max mega của tôi đã nằm trong khu vực của cột bên trái (nó màu đen, được xếp thành 2 dòng do khu vực bị đảo ngược và do đó, nó nằm ngang theo mặc định trong plugin), đã thêm vào đó thông qua các widget, ở phần trên, tôi có menu chủ đề tiêu chuẩn và tôi cần cả hai thứ đó, bây giờ tôi sẽ thử CSS, cảm ơn

    Có thể là tôi cũng đã không hoàn toàn hiểu bạn một cách chính xác.
    Tôi đang nói về menu mà bạn có trên màn hình trong khối màu xanh lá cây nhạt phía trên nằm ngang "Trà cà phê kẹo ..."
    Nhưng sau khi đọc lại câu trả lời của bạn, tôi hiểu rằng chúng ta đang nói về các menu khác nhau.
    Trên màn hình, bạn nhìn thấy ở phía bên trái của menu mega rất Max này, nhưng tôi không thấy nó trên trang web bằng cách sử dụng liên kết của bạn.
    Và kể từ khi Hôm qua tôi không gặp, sau đó tôi không nhìn vào màn hình.
    Tôi cũng không thấy nó bây giờ.

    Tôi cố gắng làm việc gì đó mọi lúc, đặt và tắt nhiều thứ khác nhau, cho đến khi tôi tìm ra cách làm cho menu này theo chiều dọc, tôi đang tìm một cái khác phù hợp. Đối với menu này, có thể áp dụng giải pháp tương tự sử dụng css như bạn đã viết? Bạn có thể cho tôi biết phần nào của mã để chèn những dòng này vào mã của chính plugin không? Vị trí có quan trọng không?
    Tôi đã đi đến Plugins-chỉnh sửa-chọn menu Max mega, sau đó có các phần như vậy:
    css
    megamenu.scss
    reset.scss
    toggle-blocks.scss
    quản trị viên
    mixin.scss
    Không tìm thấy dòng nào tương tự trong bất kỳ dòng nào để sửa

    Tôi hoàn toàn là một noob và không hiểu tại sao bạn cần nó hiển thị trên tôi, dường như để xem mã và đề xuất. Tôi đã tìm thấy câu trả lời của quản trị viên trong diễn đàn hỗ trợ Max Mega Menu rằng dọc chỉ khả dụng trong phiên bản Pro (trả phí), vì vậy hiện tại nó sẽ phải bị bỏ. Bạn có thể vui lòng tư vấn cho bất kỳ plugin nào tương tự, tiêu chí như sau:
    - khả năng cài đặt trong thanh bên
    - menu phải được thả xuống
    - khi chuyển sang bất kỳ danh mục nào, để danh mục vẫn mở ở giai đoạn này và không đóng hoàn toàn khi làm mới trang

    Chính xác.
    Không nhìn thấy chính Menu này, không thể đưa ra lời khuyên và khuyến nghị. Có lẽ một vài dòng CSS là đủ. Nhưng không phải là một sự thật.

    Mặc dù, nếu bạn thực sự có kế hoạch sử dụng Max Mega Menu này tiết lộ tất cả các khả năng của nó, thì đối với một sản phẩm như vậy 23 đô la là không nhiều. Nó có giá trị nó.

Menu chính Mega nó là một plugin để tạo menu nhanh chóng cho wordpress. Nó có các tính năng đặc biệt giúp bạn dễ dàng sử dụng hơn.

  • Menu, biểu tượng, logo và tìm kiếm cố định và thả xuống.
  • Màu sắc khác nhau. Hơn nữa, bạn có thể thay đổi màu của bất kỳ tùy chọn nào trong menu. Ngoài màu sắc, độ dốc, nền và hình ảnh cũng được sử dụng.
  • Nội dung có tới 10 biến thể. Bạn cũng có thể đặt nội dung trong menu thả xuống. Nó có thể chứa mọi thứ từ liên kết đến hình ảnh và mã ngắn.
  • Lên đến 1600 biểu tượng có thể được sử dụng trong menu trang web. Các biểu tượng này có đồ họa vector, vì vậy chúng không yêu cầu khối lượng và độ phân giải lớn. Điều này sẽ cho phép bạn sử dụng chúng ngay cả trên điện thoại di động.
  • Phông chữ cũng có nhiều loại riêng. Nó có thể sử dụng 600 phông chữ google, có thể dễ dàng cấu hình trong cài đặt plugin.


Trình cắm được cài đặt theo cách thông thường, giống như tất cả các chương trình và không có gì khó khăn. Sau khi bạn đã kích hoạt nó, sau đó bạn sẽ đi đến menu chính. Trên trang của menu này, ở phía bên trái, bạn sẽ thấy bốn tùy chọn. Đây là tùy chọn chính với cài đặt chung, sau đó là tùy chọn thiết lập giao diện của trang được gọi là giao diện, thay đổi màu sắc, phông chữ,… Ngoài ra hai tùy chọn cuối cùng là liên kết hỗ trợ và cài đặt đặc biệt dành cho chuyên gia.

Trong các tùy chọn Chung có ba tùy chọn trong các tùy chọn: chính, di động_menu, phụ. Phần chính được sử dụng để định cấu hình tất cả các giá trị menu chính. Ví dụ, ở đó bạn có thể thiết lập chiều cao, khử răng cưa của các biểu tượng, tùy chỉnh hình ảnh logo. Trong thiết bị di động và thứ cấp, các cài đặt này được sao chép riêng biệt.


Trong cài đặt Da cũng có ba biến thể của cài đặt: sơ cấp, phụ, chân trang... Trong tùy chọn đầu tiên, chúng tôi có thể tùy chỉnh nền của vùng chứa chính và chọn các chế độ xem ngang, dọc và xuyên tâm. Sau đó, phông chữ của đoạn đầu tiên, v.v.


Trong các thông số cụ thể, bạn có thể đặt phản hồi cho các thiết bị di động. Sau đó, bạn có thể đặt độ phân giải và kiểu màn hình.

Tùy chọn cuối cùng là tùy chỉnh cấu trúc trang web. Tại đây bạn chọn tùy chọn nào để bật và tùy chọn nào để tắt.

Vì vậy, đây là một plugin menu tuyệt vời có thể biến đổi chủ đề của bạn. Với sự trợ giúp của nó, bạn có thể dễ dàng lấp đầy nó bằng các biểu tượng, hình ảnh và các yếu tố khác. Điều chính là chất lượng của nó là nó có chức năng dễ dàng. Không giống như những người khác Các plugin Mega Main Menu có tác động không đáng kể đến trang web.

Này! Như mọi khi, có rất nhiều sự kiện xảy ra trong cuộc sống của tôi, vì vậy rất khó để tìm được thời gian cho blog. Hôm qua chúng tôi đã mua vé đến Sri Lanka và sẽ rời đi sớm trong 4 tháng, hãy đến thăm! Và bây giờ tôi đang tìm chiếc váy cưới đẹp nhất :))
Hôm nay chúng ta sẽ nói về cách tạo menu trong WordPress, cũng như thêm các khối này vào các vùng tùy ý của mẫu.
Chúng ta sẽ học cách tùy chỉnh menu và chỉnh sửa theo ý thích của mình.

Chỉnh sửa và tùy chỉnh menu trong WordPress

Trước tiên, chúng ta hãy xem xét chức năng có sẵn cho chúng tôi trong bảng điều khiển quản trị blog. Các mẫu mới tương thích với các phiên bản mới nhất của WordPress nên việc hiển thị menu khá đơn giản và việc tùy chỉnh không quá khó.

Sau khi chúng tôi đã tạo một chủ đề con có thể được sửa đổi mà không ảnh hưởng đến chủ đề chính, hãy thêm hàm sau vào tệp function.php của nó.

1 2 3 register_nav_menus (array ("addmenu" => __ ("Menu bổ sung", "Tên chủ đề của bạn" ) ) ) ;

register_nav_menus (array ("menu bổ sung" => __ ("Menu bổ sung", "Tên chủ đề của bạn")));

Nếu bạn không tạo chủ đề con, thì chúng tôi sẽ thêm chủ đề đó vào tệp chức năng chính của chủ đề của bạn.

Chức năng này sẽ cho phép chúng tôi thêm một menu WordPress bổ sung vào mẫu của chúng tôi và tạo một khu vực khác cho nó.

Sau khi thêm, hãy chuyển đến bảng quản trị trong "Quản lý khu vực":

Một khu vực chủ đề bổ sung sẽ xuất hiện với tên mà chúng tôi đặt trong hàm.

Nhấp vào "Sử dụng menu mới" nếu bạn muốn thay đổi các phần cho khu vực bổ sung hoặc chọn "Trang chủ". Sau đó, khu vực mới sẽ hiển thị các phần tương tự như trong Menu chính.

Trong trường hợp của chúng tôi, chúng tôi tạo một menu mới có tên là Bổ sung:

Chọn khu vực chủ đề "Menu bổ sung" cho nó.

Nhưng bây giờ chúng ta cần liên kết vùng này với các khối của mẫu. Ví dụ: chúng ta cần tạo một menu bổ sung dưới tiêu đề của một trang WordPress. Đi tới tệp header.php hoặc sao chép nó vào chủ đề con. Sau thẻ body, hãy thêm phần sau:

1 2 3 <div id = "addedmenu"> (array ("theme_location" =>"menu bổ sung")); ?></ div>

"menu bổ sung")); ?>

Hãy xem kết quả:

Chúng tôi có một menu bổ sung phía trên tiêu đề. Bây giờ chúng ta cần tạo kiểu cho nó, căn chỉnh các mục thành một dòng và di chuyển khối dưới tiêu đề.

Hãy thực hiện các thay đổi sau đối với tệp style.css:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 #additionalmenu nav (chiều rộng: 940px; / * chiều rộng vùng chứa * / margin: 0 auto; ) #additionalmenu li (display: inline; padding: 10px; / * padding * / margin: 20px 0;) #additionalmenu (width: 100%; top: 420px; / * Lề trên * / màu nền: # 000; / * màu nền * / vị trí: tương đối; )

#additionalmenu nav (width: 940px; / * container width * / margin: 0 auto;) #additionalmenu li (display: inline; padding: 10px; / * padding * / margin: 20px 0;) #additionalmenu (width: 100% ; trên cùng: 420px; / * Lề trên cùng * / background-color: # 000; / * màu nền * / position: rel;)

Hãy xem những gì đã xảy ra:

Việc hiển thị menu mà chúng tôi đã tạo vẫn còn lâu mới lý tưởng, nhưng nếu cần, bạn có thể đưa nó về dạng thích hợp cho blog của mình.

Các widget và plugin để thêm menu trong WordPress

Tôi khuyên bạn nên xem video về cách tạo menu trong WordPress:

Bài viết về đã đề cập đến tiện ích Menu Tùy chỉnh. Hãy phân tích nó một cách chi tiết hơn.

Đi tới "Giao diện" - "Tiện ích", tìm tiện ích "Menu tùy chỉnh" và kéo nó vào khu vực có sẵn cho chủ đề của bạn và phù hợp với blog:

Trong trường hợp của chúng tôi, khối menu đã được thêm vào thanh bên. Đối với nó, chúng tôi đã chọn các phần của khối Bổ sung mà chúng tôi đã tạo.

Theo đó, khối sau sẽ được hiển thị trong thanh bên bên phải:

Ngoài tiện ích con tiêu chuẩn được tích hợp trong chủ đề, cũng có nhiều plugin bổ sung được thiết kế để tạo nhiều loại menu khác nhau: dọc, ngang, thả xuống, v.v.

Ví dụ: đây là một plugin để tạo menu đa cấp dọc trong WordPress: Navgoco Vertical Multilevel Slide Menu.

Hoặc Widget Menu thả xuống tùy chỉnh nâng cao.

Cũng phổ biến là các widget có hiệu ứng jQwery cho menu, ví dụ: jQuery Slick Menu Widget.

Hãy lấy một ví dụ về cách nó hoạt động.

Sau khi cài đặt JQuery Slick Menu Widget, hãy chuyển đến Appearance - Widgets.

Một cái mới do chúng tôi cài đặt sẽ xuất hiện trong danh sách các tiện ích có sẵn. Chúng tôi di chuyển nó đến khu vực có thể truy cập, trong trường hợp của chúng tôi là thanh bên:

Chúng tôi tiết lộ cài đặt của nó:

Chúng tôi chọn tên của menu (các phần mà chúng tôi đã tạo), Tab Text - tên của khối sẽ được hiển thị trên trang web, vị trí (chọn Left - bên trái), Offset - phần bù từ cạnh trên cùng tính bằng pixel, Tốc độ hoạt ảnh - tốc độ hoạt ảnh (Nhanh). Bạn có thể chọn Auto-Close Menu để làm cho khối tự động biến mất. Và chọn màu của khối. Bấm lưu và xem kết quả:

Một menu trượt xuất hiện ở bên trái trong tiêu đề. Khi bạn nhấp vào tab, một màn hình hiển thị các phần sẽ xuất hiện:

Khi nhấn lại, khối sẽ lại biến mất.

Đây chỉ là một trong những cách cài đặt, chỉnh sửa và hiển thị menu trong WordPress.

Chọn cách thích hợp và thuận tiện nhất để tạo menu cho blog WordPress của bạn. Chúc may mắn!

Được biết rộng rãi rằng WordPress 3.0 đã bổ sung hỗ trợ cho các menu tùy chỉnh (custom menu). Điều này, theo tôi, là vô cùng tiện lợi và hữu ích. Trên thực tế, đó là nơi xuất phát bài báo này.

Sự tiện lợi nằm ở chỗ bây giờ bạn có thể tạo và cấu hình menu trực tiếp từ bảng quản trị, thêm liên kết bằng cách nhấp vào hộp kiểm và thay đổi thứ tự của các liên kết bằng cách kéo và thả. Trong menu, bạn có thể thêm liên kết đến các trang, danh mục và các bài đăng riêng lẻ. Bạn có thể tạo menu nhiều cấp, bạn cũng có thể thêm các liên kết tùy chỉnh của riêng mình vào menu, điều mà WordPress không biết về nó. Nói chung, hoàn toàn tự do hành động.

Tuy nhiên, để có được sự "tự do" như vậy, cần phải có, giả sử, với một chuyển động nhẹ của chuột, để định cấu hình đầu ra của một menu tùy ý cho mẫu.

Sẽ cực kỳ tiện lợi khi sử dụng các menu như vậy nếu bạn sử dụng tính năng multisite của WordPress, vì bạn có thể thiết lập các menu khác nhau cho các trang khác nhau và sử dụng cùng một mẫu cho chúng.

Lưu ý: menu hoạt động thông qua phân loại WordPress (nav_menu) và các liên kết tùy ý (bên ngoài) được ghi vào bảng cơ sở dữ liệu bài đăng chính. Cách tiếp cận này linh hoạt và năng động hơn, nhưng yêu cầu liên tục tạo các menu như vậy.

Register_nav_menus (array ("top" => "Top menu", // Tên vị trí menu trong mẫu "bottom" => "Bottom menu" // Tên vị trí menu khác trong template));

Bây giờ chúng tôi đã đăng ký 2 menu với ID "trên cùng" và "dưới cùng" với tên tương ứng của chúng. Cần có số nhận dạng để sử dụng chúng trong chủ đề, để chỉ ra vị trí mà thông qua hàm đầu ra wp_nav_menu (), menu được tạo trong bảng điều khiển quản trị sẽ được hiển thị. Chúng ta sẽ thấy tên các vị trí đã đăng ký trong bảng quản trị khi vào phần Giao diện -> Menu.

Sau khi các menu được đăng ký, hãy chuyển đến bảng quản trị và tạo các menu của riêng chúng tôi (trong ví dụ này là 2 menu):

    Đặt tên của menu (menu trong mẫu có thể được hiển thị theo tên đã chỉ định, sử dụng hàm wp_nav_menu ()

    Chúng tôi tạo các mục menu. Sử dụng khối bên trái: trang liên kết, tiêu đề

  1. Chúng ta chọn nơi đặt menu, vì chúng ta đã đăng ký 2 menu nên chúng ta sẽ có 2 lựa chọn là "Menu trên cùng" và "Menu dưới cùng".

Hỗ trợ cho các menu tùy chỉnh trong WordPress được bật cho từng chủ đề riêng biệt, với một dòng như vậy trong tệp tin functions.php add_theme_support ("menu"); Tuy nhiên, dòng này không cần thiết nếu chúng ta đăng ký menu. Trong trường hợp này, hỗ trợ sẽ tự động được bật.

Hiển thị các menu tùy ý thông qua hàm wp_nav_menu

Các menu đã được đăng ký và tạo, nó vẫn để thêm chúng vào mẫu. Điều này được thực hiện bởi hàm wp_nav_menu (), có thể nhận các tham số sau:

Wp_nav_menu (array ("menu" => "", // (string) Tên của menu được hiển thị (được chỉ định trong bảng quản trị khi tạo menu, // có mức độ ưu tiên hơn vị trí đã chỉ định theme_location - nếu được chỉ định, tham số theme_location là bỏ qua) "container" => "div", // (string) Vùng chứa menu. Trình bao bọc ul. Thẻ vùng chứa được chỉ định (theo mặc định trong thẻ div) "container_class" => "", // (string) lớp của vùng chứa (thẻ div) "container_id" => "", // (chuỗi) id của vùng chứa (thẻ div) "menu_class" => "menu", // (chuỗi) lớp của chính menu (thẻ ul) "menu_id" => "", // (chuỗi) id của chính menu (thẻ ul) "echo" => true, // (boolean) Hiển thị hoặc trả về để xử lý "fallback_cb" => "wp_page_menu", // (string) Hàm được sử dụng (dự phòng) nếu menu không tồn tại (không lấy được) "trước" => "", // (chuỗi) Văn bản trước đó mỗi liên kết "sau" => "", // (chuỗi) Văn bản sau mỗi liên kết "link_before" => "", // (chuỗi) Văn bản trước ký tự neo (văn bản) của liên kết "link_ after" => "", // (chuỗi) Văn bản sau ký tự liên kết (văn bản) của liên kết "độ sâu "=> 0, / / ​​(số nguyên) Độ sâu lồng (0 - không giới hạn, 2 - menu hai cấp)" walker "=>" ", // (đối tượng) Lớp thu thập menu. Mặc định: new Walker_Nav_Menu "theme_location" => "" // (chuỗi) Vị trí của menu trong mẫu. (phím được chỉ ra mà menu đã được đăng ký trong hàm register_nav_menus)));

Trong ví dụ này, bạn cần chèn vào mẫu khoảng (tùy thuộc vào thông số bạn cần) 2 mã sau:

# 1. Hiển thị menu theo vị trí

Menu trên cùng. Chúng tôi chèn vào tiêu đề mẫu (header.php), nơi trình đơn trên cùng (trên cùng) sẽ được hiển thị:

"menu", "theme_location" => "top", "after" => "/")); ?>

Sẽ hiển thị menu được tạo trong bảng quản trị được đính kèm với vị trí "Menu trên cùng" với cấu trúc tương tự:

Menu thấp hơn. Chúng tôi chèn nó vào chân trang của mẫu (footer.php), nơi menu dưới cùng (dưới cùng) sẽ được hiển thị:

Sẽ hiển thị menu được tạo trong bảng quản trị được đính kèm với vị trí "Menu dưới cùng". Cấu trúc sẽ giống với cấu trúc đầu tiên.

Lưu ý rằng trong phiên bản đầu tiên, các tham số được chuyển qua một mảng. Trong lần thứ hai, thông qua dòng. Cả hai lựa chọn đều đúng. Điều này là phổ biến đối với các hàm WordPress - các tham số có thể được truyền dưới dạng một mảng hoặc dưới dạng một chuỗi (chuỗi sau đó được chuyển đổi thành một mảng).

# 2 Hiển thị menu theo tên

Để hiển thị menu theo tên của nó, bạn có thể sử dụng đối số "menu". Tên được chỉ định, tên được đặt khi tạo menu trong bảng điều khiển quản trị. Trong ví dụ của chúng tôi (xem hình) "Menu chính". Đối số menu có mức ưu tiên cao hơn theme_location, có nghĩa là nếu chúng ta hiển thị theo tên, thì tham số theme_location sẽ bị bỏ qua.

Bạn có thể chỉ định ID menu chứ không phải tên. Vì vậy, nếu bạn thay đổi tên của menu, mã sẽ vẫn hoạt động. ID menu có thể được xem trong URL khi chỉnh sửa menu:

Ghi chú

Xóa Div trình bao bọc

Bạn có thể nhận thấy rằng menu thường được "bọc" bằng một thẻ div không cần thiết. Có thể xóa nó bằng cách chỉ định tham số "container" => "" trống trong các đối số cho hàm wp_nav_menu ().

Thay đổi các thông số mặc định

Để tránh liên tục chỉ định cùng một tham số cho các menu được chèn, chúng có thể bị ghi đè trong functions.php. Điều này được thực hiện thông qua bộ lọc wp_nav_menu_args:

Register_nav_menus (array ("top" => "Top menu", "bottom" => "Bottom menu")); add_filter ("wp_nav_menu_args", "my_wp_nav_menu_args"); function my_wp_nav_menu_args ($ args = "") ($ args ["container"] = ""; return $ args;)

Tương tự, bạn có thể tạo các đối số mặc định của riêng mình: $ args ["đối số"] = "giá trị".

Kiểm tra xem menu đã được đăng ký chưa

WordPress cũng có một chức năng điều kiện: has_nav_menu ("top") - kiểm tra xem vị trí menu trên cùng đã được đăng ký hay chưa. Nếu menu không được chỉ định, thì hàm wp_nav_menu () sẽ hoạt động giống như wp_list_pages (), nhưng trình bao bọc div sẽ vẫn còn, mặc dù thực tế là chúng tôi đã loại bỏ nó trong các đối số. Bạn có thể giải quyết vấn đề này như sau:

If (has_nav_menu ("top")) (wp_nav_menu (array ("container" => "", "theme_location" => "top", "menu_class" => "menu"));) else (echo "

"; }