здравей Както винаги, в живота ми се случват много неща, така че е много трудно да намеря време за блог. Вчера купихме билети за Шри Ланка и скоро заминаваме за 4 месеца, елате и посетете! И сега търся най-красивата булчинска рокля :))
Днес ще говорим за това как да създадете меню в WordPress, както и да добавите тези блокове в потребителски области на шаблона.
Ще научим как да персонализираме менюто и да го редактираме по ваша преценка.

Редактиране и персонализиране на менюта в WordPress

Първо, нека разгледаме функционалността, достъпна за нас в административния панел на блога. В нови шаблони, съвместими с най-новите версии WordPress, показването на менюто е доста просто и настройката не е особено трудна.

След като създадем дъщерна тема, която може да се променя, без да се засяга основната тема, ще добавим следната функция към нейния файл function.php.

register_nav_menus(array("additionalmenu" => __("Additional Menu", "Name of Your Theme")));

Ако не създадете дъщерна тема, добавете я към основния файл с функции на вашата тема.

Тази функция ще ни позволи да добавяме допълнително меню WordPress в нашия шаблон и ще създаде друга област за него.

След като добавите, отидете в админ панела в „Управление на области“:

Трябва да се появи допълнителна тематична област с името, което сме задали във функцията.

Щракнете върху „Използване на ново меню“, ако искаме да променим секциите за допълнителната област, или изберете „Начало“. След това в нова областще се покажат същите секции като в основното меню.

В нашия случай създаваме ново меню, наречено Допълнително:

Изберете областта с тема „Допълнително меню“ за него.

Но сега трябва да свържем тази област с шаблонните блокове. Например, трябва да направим допълнително меню под хедъра на WordPress сайт. Отидете до файла header.php или го копирайте в дъщерната тема. След етикета body добавете следното:

Да видим резултата:

Имаме допълнително меню над заглавката. Сега трябва да зададем стилове за него, да подравним елементите в една линия и да спуснем блока под заглавката.

Правим следните промени във файла style.css:

цвят на фона: #000;

/* фонов цвят */ позиция: относителна;

)

#additionalmenu nav (ширина: 940px; /*ширина на контейнера */ margin: 0 auto; ) #additionalmenu li ( display: inline; padding: 10px; /* padding */ margin: 20px 0; ) #additionalmenu ( width: 100% ; отгоре: 420px; /* Разстояние от горния ръб */ цвят на фона: #000; /* цвят на фона */ позиция: относителна)

Да видим какво се случи:

Дисплеят на менюто, което създадохме, все още е далеч от идеалното, но с подходяща грижа можете да го приведете във форма, която съответства на вашия блог.

Уиджети и плъгини за добавяне на менюта в WordPress Каня ви да гледате видеоклип за създаване на меню в WordPress:В статията се споменава джаджата Custom Menu. Нека го разгледаме по-подробно.

да вървим"

Външен вид

"-"Виджети", намерете изпълнимия елемент "Меню по избор" и го плъзнете в област, налична за вашата тема и подходяща за блога:

В нашия случай блокът с менюто е добавен към страничната лента. За него избрахме секциите на създадения от нас допълнителен блок.

Съответно в страничния панел вдясно ще покажем следния блок:

В допълнение към стандартния widget, вграден в темата, има и много допълнителни добавки, предназначени за създаване на различни видове менюта: вертикални, хоризонтални, падащи и т.н.

Нека да разгледаме принципа на неговата работа, използвайки пример.

След като инсталирате JQuery Slick Menu Widget, отидете на “Appearance” - “Widgets”.

Сред списъка с налични джаджи трябва да се появи нова, инсталирана от нас. Преместете го в достъпна област, в нашия случай страничната лента:

Нека разширим настройките му:

Изберете името на менюто (секции, които създадохме), Tab Text - името на блока, който ще се показва на сайта, местоположението на разположение (изберете Left - вляво), Offset - отместването от горния ръб в пиксела, Animation Speed ​​​​- скоростта на анимацията (Fast). Можете да изберете Auto-Close Menu, за да накарате блока да изчезне автоматично. И изберете цвета на блока. Щракнете върху запазване и вижте резултата:

В лявата част на заглавката се появи плъзгащо се меню. Когато щракнете върху раздела, се появява екран със секции:

При повторно натискане блокът отново ще изчезне.

Това е само един от начините за инсталиране, редактиране и показване на менюта в WordPress.

Изберете най-подходящия и удобен начин за създаване на меню за вашия WordPress блог. Успех!

Съвсем наскоро такава функция като Mega Menu беше ексклузивен домейн на първокласни плъгини и теми. Но днес ще ви представя, скъпи читатели, два напълно безплатни плъгина, които ще ви позволят бързо, лесно и, разбира се, напълно безплатно, да изградите мощно навигационно меню на вашия уебсайт, което не е толкова по-лошо от платеното двойници.

Какво изобщо е това мега меню? Да, същото нещо, обичайното меню за навигация, което вероятно сте срещали и персонализирали повече от веднъж. Просто, за разлика от стандартната функционалност, има и такива допълнителни функцииза конфигуриране и показване на отделни елементи. Например добавяне не само на вертикални, но и на хоризонтални подменюта, добавяне на икони и отделни изображения към менюто, подробна настройкавъншен вид за всички елементи от менюто и др. Всичко това е в нашите плъгини, разгледани днес.

Друга чудесна възможност да добавите супер готино навигационно меню към вашия сайт с плъгин е Mega Menu от WooRockets.com. Инсталирането и активирането на плъгина са стандартни.

Този плъгин е малко по-труден за научаване, но също така предлага повече възможности от конкурента, описан по-горе. Тук конструкцията на менютата е много подобна на конструкцията на страници в стандартния Visual Composer.

Отидете в секцията WR мега менювъв вашия админ панел и щракнете върху Добавяне на нов. Стигаме до нова страницаза съставяне на ново меню. Тези, които вече са се занимавали с композитори Drag & Drop, веднага ще се почувстват като у дома си. Процесът на изграждане на меню не се различава много от изграждането на страница.

Първо се уверете, че в горната част на менюто - МестоположениеМенюто е точно това, от което се нуждаете. Или щракнете върху Управление на местоположениетоза да изберете меню.

Щракнете - Добавяне на елементи изберете в изскачащия прозорец типа съдържание, което искате да добавите към менюто. Горе вляво можете да избирате от предлаганите стандартни опции или да добавяте WordPress widget.

Ако е необходимо, добавете линии, разделени на необходимо количествоколони. Отляво има раздели за плъзгане на елементи от менюто нагоре или надолу, а отдясно са раздели, където можете да активирате редактиране или изтриване. Не забравяйте да натиснете обичайния бутон вдясно - Публикувайили - Актуализацияда запазят резултатите от своя труд.

Като цяло, всякакви текстове, снимки и, ако желаете, всякакви джаджи могат лесно да бъдат поставени в новото ви меню. Изгледът на менюто може да бъде променен чрез щракване върху бутона Стайлингили вмъкнете вашите таблици до него с помощта на бутона Персонализиран CSS.

Много функционално нещо, накратко. Не е за нищо, че авторите, в допълнение към този плъгин, също имат: форма за контакт и, разбира се, композитор, който очевидно е послужил като основа за плъгина за мега меню. Можете да видите работещото демо в целия му блясък тук.

Страхотни и мощни добавки, с които на практика можете да създадете менюто на вашите мечти. Единственият момент, който може леко да помрачи радостта на потребителите, е въпросът за съвместимостта с различни теми. За съжаление, доколкото си спомням, този проблем понякога възникваше с премиум плъгини. Тествах и двата плъгина на стандартна тема и не забелязах никакви проблеми или грешки. Пожелавам го и на вас, приятели!

Време за четене: 8 минути. Публикувана на 01.11.2016 г

здравейПродължаваме да анализираме най-интересното и най- полезни добавкиза WordPress сайт! Днес ще научите за един супер полезен плъгин, който ще ви позволи да създадете хоризонтално падащо меню. Можете да вмъкнете всякакви джаджи, текст, редактор, снимки, видеоклипове, формуляри, html код в падащото меню.

Ще можете напълно да персонализирате външния вид на менюто и да персонализирате падащото меню. Можете да добавите до 8 колони с осем колони към хоризонтално падащо меню. Можете да деактивирате падащото меню за мобилни устройства. Много гъвкав плъгин, можете да направите супер меню!

Можете да инсталирате приставката Super директно от административния панел на WordPress. Отидете на страницата: Plugins – Add new, въведете името на приставката във формата за търсене, натиснете Enter, инсталирайте и активирайте приставката.

Общи настройки .

– Щракнете върху Поведение при събитие,поведение при кликване. Тук имате две възможности за избор:

• Първото щракване ще отвори подменю, второто щракване ще затвори подменюто, първото щракване отваря подменю, второто щракване затваря подменюто;
• Първото щракване ще отвори подменю, второто щракване ще последва връзката, първото щракване отваря подменю, второто щракване отваря връзката.
• Оставете го по подразбиране, не променяйте нищо.

– Поведение на мобилното меню,поведение в мобилното меню,

• Стандартно – Отворените подменюта ще останат отворени, докато не бъдат затворени от потребителя, Стандартно - отворено подменю ще остане отворено, докато потребителят не го затвори.
• Акордеон – Отворените подменюта ще се затворят автоматично, когато се отвори другоАкордеон – отворените подменюта ще се затворят автоматично, когато друго е отворено.

– CSS изходОставете го по подразбиране, нищо не трябва да се променя тук.

– Описания на елементи от менюто,активиране или деактивиране на описания за елементи от менюто.

– Активни менютаНякои теми ще показват местоположението на менюто няколко пъти на една и съща страница. Например вашата тема може да показва местоположение на менюто след главното меню, а след това отново за менюто за мобилни устройства. Тази опция може да се използва, за да се гарантира, че Max Mega Menu се прилага само за един от тези случаи.

– .

Теми на менюто .

– Изберете тема за редактиране,Това е менюто, което ще редактирате. Можете да създадете и изберете различно меню.

– Заглавие на темата,заглавието на темата на менюто, оставете го по подразбиране.

– стрелка,можете да изберете стрелката, която се появява в елемента от падащото меню.

– Височина на реда,линия на височина.

– Z индекс,индикаторът Z Index може да бъде оставен по подразбиране.

– сянка,Можете да персонализирате сянката на менюто.

– преходи при задържане,активиране на преходи при задържане на курсора на мишката върху елементи от менюто.

– Нулиране на стила на джаджи,деактивирайте стиловете на уиджетите на Mega Menu.

Лента с менюта .

– Височина на менюто,височина на менюто.

– Фон на менюто,цвят на фона на менюто.

– Подложка на менютотапицерия на менюто.

– Радиус на границата на менюто,радиус на границата на менюто.

– Подравняване на елементи от менюто,местоположение на елементите от менюто.

– Фон на елемент от менюто,цвят на фона на елементите от менюто.

– Фон на елемент от менюто (задържане на курсора на мишката),цвят на фона на елемента от менюто при задържане.

– Разстояние между елементите на менюто,интервал на елемент от менюто.

– шрифт,параметри на шрифта, цвят, размер, местоположение, семейство и др.

– Шрифт (Hover)опции за шрифт при задържане на мишката.

– Подложка на елемент от менюто,тапицерия на елементи от менюто.

– Граница на елемент от менюто,опции за рамка на елемент от менюто.

– Граница на елемент от менюто (задръжте курсора на мишката),Опции за рамка на елемент от менюто при задържане на курсора на мишката.

– Радиус на границата на елемент от менюто,параметри на радиуса на границата на елемент от менюто.

– Разделител на елементи от менюто,разделител на менюто.

– Маркирайте текущия елемент,маркирайте текущия елемент от менюто.

Мега менюта .

– Фон на панела,цвят на фона на падащото меню.

– Ширина на панелаШирината на прозореца на падащото меню.

– Подложка на панела,тапицерия.

– Граница на панела,цвят и размер на границата.

– Радиус на границата на панела,радиус на границата.

– Подложка на артикул, подпълване на елемент от менюто в падащо меню.

Джаджи .

– Шрифт на заглавието,опции за шрифт на заглавието на джаджа в падащото меню.

– Подплата за заглавиеподложка на заглавката.

– Поле на заглавиеподложки от границите на заглавката на джаджата.

– Граница на горния колонтитул,гранични параметри на границата.

– Шрифт на съдържанието,шрифт в съдържанието на джаджата.

Елементи от менюто от второ ниво .

– шрифт,шрифт на елемент от менюто от второ ниво.

–Шрифт (Hover)шрифт при насочване на мишката.

– Фон (задръжте курсора на мишката),цвят на фона при задържане.

– Подложка,тапицерия.

– Марж,отстъп

– граница,бордюр, граница.

Елементи от менюто на трето ниво . Същите настройки, само за елементи от менюто от трето ниво.

Изскачащи менюта .

– Фон на менюто,цвят на фона на падащото меню от второ или трето ниво.

– Ширина на менютоширина на менюто.

– Подложка на менютотапицерия.

– Граница на менюто,граница.

– Радиус на границата на менюто,радиус на границата.

– Фон на елемента,цвят на фона на елемент от менюто.

– Фон на елемент (задържане на курсора на мишката),цвят на фона на елемента при задържане.

– Височина на елемента,височина на елемент от менюто.

– Подложка на артикулелемент за тапицерия.

– Шрифт на елемента,шрифт на текста в елемента от менюто.

– Шрифт на елемента (задръжте курсора на мишката),шрифт при насочване на мишката.

– Разделител на предметиразделител на елементи.

Мобилно меню .

– Превключване на дизайнер на лента,Това показва как изглежда менюто на мобилни устройства.

– Отзивчива точка на прекъсване,ширина за влизане в мобилното меню.

– Превключване на фона на лентата,цвят на фона на бутона за отваряне на мобилното меню.

– Деактивирайте мобилното превключване,Можете да изключите превключвателя на менюто.

– Превключване на височината на лентата,височина на превключвателя на мобилното меню.

– Мега колони на менюто,колко колони има в едно падащо меню на мобилен сайт.

– Фон на менюто,цвят на фона на мобилното меню.

– Височина на елемент от менюто,височина на елемент от менюто.

Персонализиран стил. Тук можете да добавите свои собствени CSS стилове за менюто.

– Запазете промените си.

Местоположение на менюто .

– тук можете да създавате области на менюто, към които след това да добавяте менюта. За да създадете зона за менюто, щракнете върху бутона – Добавяне на друго местоположение на менюто.

Област на менютоможете да добавите към сайта с помощта на кратък код или php код.

На страницата: Външен вид – Меню – Мениджмънт на района, ще можете да добавите меню за района.

Инструменти .

– Кеш паметТук можете да изчистите CSS кеша, не е необходимо, кешът се изчиства автоматично при всяко записване на менюто.

– Данни за приставкатаизтрийте всички данни на плъгина, запазени в базата данни на WordPress. Само ако плъгинът е премахнат!

– Експортиране на тема,Можете да експортирате темата на мега менюто във формат JSON или PHP.

– Импортиране на тема,Можете да импортирате мега темата на менюто.

– АктивирайтеПоставете отметка в квадратчето тук, за да активирате мега менюто.

– събитие,Тук можете да изберете как да се отвори падащото меню.

– ефектМожете да изберете ефект от падащото меню.

– Тема,тема на менюто по подразбиране.

След като включите мега менюто,във всеки уиджет на страница, когато се задържи, ще се появи бутон - Мега Меню. Щракнете върху този бутон, за да конфигурирате падащото меню за този елемент от менюто.

следващ,ще се отвори прозорец. Горе вдясно щракнете върху широкото поле, за да изберете изпълним модул и да го добавите към менюто. Горе вдясно можете да изберете колко колони ще има в падащото меню. Уиджетите могат да бъдат разпределени в падащ панел; можете да посочите коя част ще заема приспособлението, например 1/2 или 1/3. Кликнете върху стрелките надясно и наляво, за да посочите коя част ще заеме джаджата.

За да отворите и конфигурирате изпълнимия модул,добавете каквото и да е съдържание към него и т.н., от дясната страна на джаджата щракнете върху иконата на ключ. Настройте джаджата и я запазете.

– Скриване на текста,скриване на текст от елемент от менюто.

– Скриване на стрелка,скрий стрелка.

– Скриване на елемент на мобилно устройство,скриване на елемент от менюто на мобилни устройства.

– Скриване на елемент на работния плот,скриване на елемент от менюто на компютри.

– Елемент от менюто Подравняване,местоположение на елемент от менюто.

– Подравняване на подменютоместоположение на менюто от второ ниво.

– Скриване на подменюто на Mobile,скриване на менюто от второ ниво на мобилни устройства.

– Запазете промените.

Всичко е готово!Запазете менюто, отидете на сайта и се насладете на резултата!

внимание!След като активирате Mega Menu, вашият стил на менюто по подразбиране ще бъде напълно променен. Ще трябва да персонализирате стила на менюто в раздела Настройки „Теми на менюто“.

Все още имате въпроси? Напишете коментар! Успех!

Доколкото разбирам, терминът мега меню в WordPress означава суперфункционален огромен блок с много различни елементи: списъци, картинки, текстове, слайдери и т.н. Със сигурност сте срещали такива хора. Някой ден ще публикувам пълна колекция по темата, но днес ще говорим за едно много специфично решение - плъгина Max Mega Menu. Избрах го, защото вече го бях тествал в работата, често попада в списъци, освен това има една от най-интелигентните и постоянно развиващи се безплатни (Lite) версии.

Веднага след инсталирането на Max Mega Menu в WordPress, вашата стандартна навигация ще се трансформира в по-мощен и функционален механизъм с възможност за добавяне на различни видове уиджети, удобен редактор и куп допълнителни настройки. Изтеглете плъгина от тук или го потърсете чрез администратора на WP.

В момента минималната необходима версия на системата е 3.8, последната версия в момента е 4.8.3. Има около 100 хиляди изтегляния. Харесва ми, че през последните 2 месеца бяха коригирани почти 70 различни грешки от 89, което показва добра активност от разработчиците.

Основни функции и характеристики на Max Mega Menu

• Поддържат се няколко места за поставяне, за всяко от които можете да изберете свои собствени параметри;
• Лесна работа с навигационни елементи чрез Drag&Drop.
• Допълнение.
• Има удобен редактор на теми.
• Добавяне на всякакви джаджи: снимки, текстове, списъци и др.
• Условие на задействане: щракване при задържане.
• Ефекти на дисплея на подменюто: заминаване, поява/избледняване и др.
• Различни допълнителни опции като скриване на текст/линкове или изключване мобилна версия. Последна точкаще помогне за опростяване на създаването на отделен .
• Подравняване за елементи от менюто.

За да разберете колко готино и удобно е всичко това, съветвам ви просто да гледате следното видео:

Освен това разработчиците могат да се похвалят с много правилен и правилен подход при създаването на своето решение. WordPress Max Mega Menu е наистина висококачествен продукт, ето няколко потвърждения:

• целият дизайн е зададен с помощта на един CSS файл, където „известният” важен имот изобщо не се използва;
• Поддръжка на Retina, адаптивност, задействане на смартфони и таблети (тествано в почти всички съществуващи настолни и мобилни браузъри);
• чист код, JS скриптовете, когато са архивирани, ще заемат по-малко от 2Kb;
• поддръжка за различни филтри/куки;
• подробна документация + за разлика от много други добавки, поддържа форума доста оживен.

Настройка и работа с Max Mega Menu

Веднага след инсталирането в админ панела ще се появи раздел със същото име. В „Основни настройки“ можете да регулирате няколко опции относно поведението на подменюта, мобилни устройства и др. „Темите“ изглеждат много по-интересни.

Тук има 6 раздела с различни функции:

• Основни - изберете вида на стрелките, сенките, височината на линията и др.
• Лента с менюта - дизайн на основния блок: фонове, отстъпи, шрифтове, курсор.
• Мега менюта - стилове и Мега настройкиМеню.
• Падащите менюта са набор от стилове, подобни на останалите.
• Мобилно меню - задействане на размера на екрана и други опции на мобилното меню.
• Персонализиран дизайн - добавете свои собствени CSS стилове.

След като са зададени основните параметри, отидете в секцията на администратора на WP „Външен вид“ - „Меню“.

Трябва да изберете менюто, с което искате да работите, и след това в неговите настройки да поставите отметка в квадратчето „Активирано“. Можете да активирате Max Mega Menu в WordPress само когато менюто има зона за показване, посочена в шаблона (заглавка, долен колонтитул, странична лента и т.н.). Има и параметри за ефекти и задействащи събития.

За да отворите редактора на модула, задръжте курсора върху един от йерархичните елементи и щракнете върху бутона „Мега меню“, който се появява. Изскачащ прозорец ще покаже съответния инструмент, който може да сте видели във видео презентацията на плъгина по-горе.

Тук можете първо да определите броя на колоните и също да добавите всякакви джаджи. Освен това размерът на всеки елемент може да се променя. Можете да избирате само модули в първото (основно) ниво на навигация. Ако щракнете върху бутона „Мега меню“ срещу други елементи, тогава само за да зададете икони и различни свойства:

Скриването на текст/връзка, подравняването и деактивирането на настолен/мобилен телефон е много полезен набор от функции. Възможно е да зададете такива опции във всеки елемент от менюто. Не забравяйте да запазите промените си.

Max Mega Menu Pro и заключения

Като цяло, в допълнение към хранилището, тази разработка има и отделен уебсайт. Има описания на всички възможности на модула, представена е документация и малка демонстрация от него, както и линк към техническа поддръжка и изтегляния. Разходи за напреднали Макс версии Mega Menu Pro по принцип не е толкова скъп - за 1 / 5 / 99 сайта ще ви струва съответно $23 / $35 / $99 долара. Това включва актуализации и поддръжка през цялата година. Ако сте разработчик, тогава като вземете Pro Business License и инсталирате плъгина на 5 сайта, ще получите общата цена на решението = 7 долара!

Какво е включено в Max Mega Menu Pro:

• Интегриране на Google Fonts, FontAwesome и персонализирани икони в настройките.
• Поддържа вертикални и акордеонни менюта.
• Общо лого в навигацията + блок за търсене.
• Стилове на отделни елементи.
• Поддръжка на WooCommerce и EDD.
• Възможност за персонализиране.
• Търсене, икони/лога и HTML за мобилни елементи.
• Автоматична актуализация и приоритетна поддръжка.

За обикновените класически сайтове обикновеният е напълно достатъчен безплатна версия Max Mega Menu в WordPress, което е много добро като функционалност. Различни настройкитук има много. Хареса ми също, че разработчиците поддържат тяхното създаване, коригират текущите грешки сравнително бързо и се грижат за чистотата/коректността на кода. Ще отнеме известно време, за да се запознаете, но ще си струва. За да разберете по-лесно как работи плъгинът, гледайте видеоклипа и прочетете документацията.

Кои модули Mega Menu в WordPress използвате и защо? Работили ли сте с това решение, какво можете да добавите за него?

Широко известно е, че WordPress 3.0 добави поддръжка за персонализирани менюта (персонализирани менюта). Нещото според мен е изключително удобно и полезно. Всъщност оттук идва тази статия.

Удобството е, че вече можете да създавате и конфигурирате менюта директно от административния панел, като добавяте връзки чрез щракване върху квадратчетата за отметка и променяте реда на връзките чрез просто плъзгане и пускане. Можете да добавяте връзки към страници, категории и отделни публикации към менюто. Можете да създавате менюта на няколко нива и можете също да добавяте свои произволни връзки към менюто, за което WordPress не знае. Като цяло пълна свобода на действие.

Въпреки това, за да бъде налична такава „свобода“, трябва, да речем, с леко движение на мишката да конфигурирате показването на потребителско меню в шаблон.

Ще бъде изключително удобно да използвате такива менюта, ако използвате мултисайтовата функция на WordPress, защото можете да настроите различни менюта за различни сайтове и да използвате един и същ шаблон за тях.

Забележка: менюто работи чрез таксономията на WordPress (nav_menu) и произволни (външни) връзки се записват в основната таблица на базата данни с публикации. Този подход е по-гъвкав и динамичен, но изисква постоянно генериране на такива менюта.

Register_nav_menus(array("top" => "Горно меню", //Име на местоположението на менюто в шаблона "bottom" => "Долно меню" //Име на другото местоположение на менюто в шаблона));

Сега имаме регистрирани 2 менюта с идентификатори "top" и "bottom" със съответните им имена. Идентификаторите са необходими, за да се използват в темата, за да се посочи мястото, където чрез изходната функция wp_nav_menu() ще се покаже менюто, създадено в административния панел. Ще видим имената на регистрираните локации в админ панела, когато отидем в секцията Изглед -> Меню.

След като менютата са регистрирани, отидете в административния панел и създайте своите менюта (в в този пример 2 менюта):

Задайте името на менюто (менюто в шаблона може да се показва с посоченото име с помощта на функцията wp_nav_menu()

Създаване на елементи от менюто. Използваме левия блок: страници с връзки, категории

1. Избираме къде ще се намира менюто, тъй като регистрирахме 2 менюта, ще имаме 2 опции: „Горно меню“ и „Долно меню“.

Поддръжката за персонализирани менюта в WordPress е активирана за всяка тема поотделно, с този ред във файла functions.php add_theme_support("menus"); Този ред обаче не е необходим, ако регистрираме меню. В този случай поддръжката ще бъде активирана автоматично.

Показване на потребителски менюта с помощта на функцията wp_nav_menu

Менютата са регистрирани и създадени, остава само да ги добавите към шаблона. Това се прави от функцията wp_nav_menu(), която може да приема следните параметри:

Wp_nav_menu(array("menu" => "", // (низ) Името на показаното меню (посочено в администратора при създаване на менюто, то има предимство // пред посоченото местоположение theme_location - ако е посочено, параметърът theme_location се игнорира) "container" => "div", // (низ) ul обвивка на менюто Указва етикета на контейнера (по подразбиране в тага div) "container_class" => "", // (низ) клас на. контейнерът (div таг) "container_id" => "" , // (низ) идентификатор на контейнера (div таг) "menu_class" => "меню", // (низ) клас на самото меню (таг ul) "menu_id" => "", // (низ) идентификатор на самото меню ( таг ul) "echo" => true, // (булев) Показване или връщане за обработка "fallback_cb" => "wp_page_menu", // (низ) Функцията (резервен) за използване, ако менюто не съществува (не може да бъде получено) "преди" => "", // (низ) Текст преди всяка връзка "след" => "", // (низ) Текст следвсяка връзка "link_before" => "", // (низ) Текст преди котвата (текст) на връзката "link_after" => "", // (низ) Текст след котвата (текст) на връзката "дълбочина " => 0, / / ​​(цяло число) Дълбочина на вмъкване (0 - неограничено, 2 - меню на две нива) "walker" => "", // (обект) Клас, който събира менюта. По подразбиране: ново Walker_Nav_Menu "theme_location" => "" // (низ) Местоположението на менюто в шаблона. (показва ключа, с който е регистрирано менюто във функцията register_nav_menus)));

В този пример трябва да вмъкнете приблизително (в зависимост от необходимите параметри) следните 2 кода в шаблона:

#1. Показване на менюта по местоположение

Горно меню.Вмъкваме го в заглавката на шаблона (header.php), където ще се покаже горното меню:

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

Ще покаже меню, създадено в административния панел, прикрепено към местоположението „Горно меню“ с подобна структура:

Долно меню.Вмъкваме го в долния колонтитул на шаблона (footer.php), където ще се покаже долното меню:

Показва менюто, създадено в административния панел, прикрепено към местоположението „Долно меню“. Структурата ще бъде идентична с първата.

Моля, обърнете внимание, че в първата опция параметрите бяха предадени през масив. Във втория, чрез линия. И двата варианта са правилни. Това е обичайно за Функции на WordPress- параметрите могат да бъдат предадени или като масив, или като низ (след това низът се преобразува в масив).

#2 Показване на менюто по име

За да покажете меню по името му, можете да използвате аргумента "меню". Името се посочва като това, което е зададено при създаване на менюто в админ панела. В нашия пример (вижте снимката) „Главно меню“. Аргументът на менюто има по-висок приоритет от theme_location, което означава, че ако показваме по име, параметърът theme_location ще бъде игнориран.

Можете да посочите ID на менюто, а не името. Така че, ако името на менюто се промени, кодът ще продължи да работи. Идентификационният номер на менюто може да се види в URL адреса, докато редактирате менюто:

Бележки

Нека премахнем обвивката на Div

Вероятно сте забелязали, че менюто често е „обвито“ с ненужен div таг. Той може да бъде премахнат чрез указване на празен параметър "container"=>"" в аргументите на функцията wp_nav_menu().

Промяна на настройките по подразбиране

За да се избегне постоянното указване на един и същи параметър за вмъкнати менюта, те могат да бъдат заменени във functions.php. Това става чрез филтъра wp_nav_menu_args:

Register_nav_menus(array("top" => "Горно меню", "bottom" => "Долно меню")); add_filter("wp_nav_menu_args", "my_wp_nav_menu_args"); функция my_wp_nav_menu_args($args="")( $args["container"] = ""; return $args; )

По аналогия можете да създадете свои собствени аргументи по подразбиране: $args["argument"] = "value" .

Проверява се дали менюто е регистрирано

WordPress също има функция за условие: has_nav_menu("top") - проверява дали местоположението на горното меню е регистрирано. Ако менюто не е посочено, тогава функцията wp_nav_menu() ще работи като wp_list_pages() , но „обвивката“ на div ще остане, въпреки факта, че сме я премахнали от аргументите. Можете да разрешите този проблем по следния начин:

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

"; wp_list_pages(array("depth" => 1, "title_li" => "")); echo "