27
2011
JQuery плагин вертикального аккордеон меню для блога WordPress
Написал 
Здравствуйте, дорогие читатели блога. В этот день расскажу Вам я про превосходный плагин, который создаёт на блоге WordPress классное меню аккордеон - JQuery Accordion Menu Widget. Я сам пользуюсь этим плагинов, и естественно Вы его можете посмотреть в действии справа в рубриках. Очень удобный плагин, просто вставляешь через админку виджет и радуйся.
Плагин
Плагин JQuery Accordion Menu Widget легок в установке и в использовании, к тому же очень функционален. В нем присутствует несколько тем оформления, цветов самого меню, а именно красное, синее, чёрное и серое. Соответственно это аккордеон меню вольётся практически в любой дизайн блога.
Ещё огромный плюс плагина – это простота установки. Всего лишь нужно его скачать, затем установить, после плагин создаст виджет, который Вам просто нужно будет добавить в сайдбар Вашего блога.
Ну а теперь давайте перейдём к процессу установки и настройки плагина.
Установка плагина
Теперь нужно, в админке блога, зайти во вкладку плагины, затем выбрать Добавить новый и в поле для поиска вписать JQuery Accordion Menu Widget далее нажать поиск.
Нужный нам плагин будет самый первый в списке. А под ним будет ссылка Установить плагин. После того как он установится нужный нам виджет появится во вкладке Внешний вид – Виджеты.
На рисунке выше я подчеркнул название самого виджета.
После Вам всего лишь понадобится перетащить его в сайдбар, который находится сплава, в нужно Вам место.
Настройки плагина
После того как виджет будет добавлен в сайдбар его можно будет настроить по Вашему вкусу. А именно выбрать цвет самого меню, тему оформления. Как будет открываться меню при наведении на него или при клике. Углубляться сильно в настройки не буду, они лёгкие и понятные.
Важный момент: рубрики и подрубрики.
Если на Вашем блоге есть подрубрики к рубрикам, Вам нужно создать произвольное меню. Это нужно для того, чтобы плагин меню корректно их отображал и вообще работал.
Чтобы создать произвольное меню в WordPress Вам нужно зайти в Внешний вид, а затем в Меню. Далее нужно придумать название меню, выберите какое Вам понравится:-) после нажимаем на кнопочку Создать меню.
Когда меню будет создано нужно будет выбрать его элементы, в нашем случае это будут рубрики. Ниже будет не большое окошко с рубриками, в этом окошке нужно будет выбрать вкладку Все, затем нажать Выделить все, а после нажать Добавить в меню. Теперь давайте посмотрим что у меня получилось с рубриками на beloweb.ru.
Теперь нужно создать подрубрики. В данном случае у рубрики WordPress будет подрубрика Плагины. Для этого Плагины нужно перетащить чуть правее. Смотрите на рисунке ниже, что у меня получилось.
После того ка Вы сделаете этот шаг, плагин JQuery Accordion Menu Widget будет работать.
Надеюсь, что всё ясно и доступно объяснил. Если Вам всё таки Вам будет что то не понятно спрашивайте в комментариях. До скорых встреч, друзья.
Поделись с друзьями в:
Подпишись на новости по email
|
|
| Понравилась статья? Тогда обязательно поделитесь ей с друзьями! |
|---|
Интересные статьи
Бесплатные PSD исходники веб элементов для создания красивого сайта
200+ свежих и бесплатных социальных иконок для Ваших сайтов
Удивительная подборка красивых сайтов с подводным веб – дизайном
Как сделать плавную прокрутку к заданному месту на странице с использованием JQuery
О авторе блога: Александр Белоус
Всем привет. Зовут меня Белоус Александр. Я являюсь автором блога beloweb.ru,
Комментарии вКонтакте
50 Комментариев + Добавить комментарий
Оставить комментарий
Рубрики
Теги
Свежие записи
- Бесплатные PSD исходники веб элементов для создания красивого сайта
- 200+ свежих и бесплатных социальных иконок для Ваших сайтов
- Скачать бесплатные кожаные текстуры для Ваших проектов
- Удивительная подборка красивых сайтов с подводным веб – дизайном
- Удивительные шедевры талантливого художника – Яна Макартура
- Как сделать плавную прокрутку к заданному месту на странице с использованием JQuery
- 15 премиум и бесплатных WordPress шаблонов для Ваших новых блогов
- Как сделать красивые метки (теги) для сайта только с помощью CSS3
- Новые слайдеры изображений и ещё несколько полезных JQuery и CSS3 вещей для веб – мастера
- Как прикрепить готовое модальное окно к сайту с помощью CSS и JQuery
Популярное
- Как добавить кнопки закладок и социальных сетей на сайт или блог. И зачем они нужны. Просмотров - 19 924
- 10 бесплатных JQuery галерей и слайдеров для сайта Просмотров - 8 210
- Photoshop PSD исходники кнопок и иконок для сайта Просмотров - 5 410
- Бесплатные кнопки и иконки, формы обратной связи и входа, меню и ещё множество стильных вещей Просмотров - 5 099
- 10 бесплатных HTML, CSS шаблонов для сайта. Просмотров - 4 811
- Новые и бесплатные CSS, HTML5 шаблоны 2012 года Просмотров - 4 374
- JQuery плагин вертикального аккордеон меню для блога WordPress Просмотров - 3 893
- Подборка самых красивых сайтов мира Просмотров - 3 848
- Подборка меню с JQuery и CSS3 для сайта Просмотров - 3 285
- Новые и бесплатные HTML5 шаблоны для Вашего сайта с встроенными JQuery слайдерами изображений Просмотров - 2 935
Спасибо чел буду внедрять в жизнь данный плуг
А с версией WP 2.91 он будет дружить?
Наверное нет, автор пишет, что требуется версия 3.0 и выше. Хотя может и будет работать.
Хм, работает на 2.91 отлично. Только что проверял.
Александр подскажите как настроить плагин как у вас на сайте, чтоб меню было выпадающим.
Что у Вас именно не получается?
Я создаю произвольное меню, рубрики и подрубрики, но меню у меня получается просто меню, не выпадающее как у вас, а у меня на сайте много подрубрик.
Я так понял меню которое справа? В админке зайдите в «внешний вид» затем «виджеты» далее в виджете плагина измените Click на Hover
Подскажите какой плагин использовался для соц кнопок….?
Марьян, посмотрите вот эту статью http://beloweb.ru/wp/top-13-plaginov-dlya-sotsialnyih-zakladok-na-blog-wordpress.html
Огромное спасибо за статью. Это именно то, что мне было нужно. Просто идеально подошёл.
И Вам спасибо за комментарий
А есть ли плагин, который позволяет делать аккордеон в записи? У меня есть длинное оглавление, в котором есть разделы, и в каждом разделе несколько параграфов. Вот бы их сворачивать в аккордеон…
Алексей, за плагин не знаю, но можно в пост добавить самому любой аккордеон, даже слайдер, единственная проблема, что код нужно вставлять самому. Аккордеон меню можете посмотреть тут http://beloweb.ru/javascript-jquery/16-besplatnyih-jquery-i-css3-poleznostey-dlya-vashego-sayta.html Думаю, найдёте что нибудь полезное.
Александр, у меня не получается так, чтоб когда наводишь на рубрику, выдвигались подрубрики, как у тебя на сайте. Поставил галочку на Hover, и всё остальное сделал как ты пишешь…
Может моя тема не поддерживает, типа, такие эффекты…
Антон, а как у Вас подрубрики показываются? Только после клика? И скажите, кака у Вас версия вордпресс?
Под главной рубрикой идут подрубрики, и нет такого эфекта чтоб заезжали и выезжали. Вордпресс у меня версии 3.3
Что пред кликлм что после, подрубрики всегда видны ниже главной рубрики.
Антон, попробуйте убрать все галочки в виджете, и там где Hover Delay поставьте No Delay. Если не поможет, скорее всего плагин пока что не совместим с новой версией вордпресс, будем ждать обновления плагина.
А на версии 3.2 работает?
Не помогло…
У меня версия 3 2 1 и как видите работает. Возможно у Вас шаблон такой. Или проверьте в Хроме. Возможно в Опере не работает.
Да, поставил другую тему всё заработало.
А можно над старой темой как нибудь поколдовать с кодами или еще чем, чтоб и на ней заработал плагин?
Антон, честно скажу в php я не разбираюсь, извините, тут я ничем помочь не могу.
Подскажите, в чем может быть дело, плагин установился без проблем, но он некорректно работает: меню при любых настройках виджета всегда в развернутом виде (главные пункты меню и подменю выведены просто как карта сайта и ни сворачиваются, ни разворачиваются). Пробовал разные темы (шаблонов 20 ставил). Версия WordPress актуальная – 3.3.1. Может где то что то прописывать надо дополнительно, чтобы плагин нормально работал?
Алексей, Вы точно как в статье всё сделали? Меню делали?
Конечно я сделал меню и в нескольких пунктах меню сделал подменю, в виджете выбрал это меню.. я сделал все как у Вас в статье.. Но меню выдается как карта сайта – списком. В самом виджете я перебрал все варианты настроек, в виджете работают скины (т.е. шкуры меняются), но меню остается полностью расрыто (все пункты меню).
Я читал офиц. фак (форум) этого плагина, там описаны какие то проблемы, но все на английском, что понимал – делал: пробовал по другому подключить jQuery-библиотеки, прописывал разные версии библиотек и с прямой ссылки с Гугля и закачивал себе на сайт, подгружал библиотеку из functions.php и другими способами в header.php.
Может напишете названия шаблонов где Вы точно пробовали этот плагин и он работал, хотя я кучу шаблонов перепробовал и вряд ли в этом дело…
Возможно, выше в комментариях, написано, что поменяли шаблон и всё заработало, но мне кажется, что тут ещё проблема в версиях вордпресс, особенно с последней, и с которой плагин никак пока дружить не хочет. У меня версия 3.2.1. и как видите всё работает.
Попробуйте скачать шаблон как у меня и проверить на нём, его название AllTuts.
Теперь ясно, что дело не в шаблоне, с шаблоном AllTuts тоже самое. Далее, методом исключения я пробовал отключать плагины, которые используют jQuery, в т.ч. nextgen-gallery, и убирал слайдер на jQuery врезанный в шапку, всё равно менюшка не работает должным образом… Если все таки дело в версии WP то обидно… хотелось использовать этот плагин…
Последняя надежда – может быть Вы или другой спец, который прочитает этот коммент подскажет мне в чем дело посмотрев меню на моем сайте http://антольчик.рф – я поставил эту менюшку на пару – тройку дней (т.к. больше не хочу чтобы она висела в неработающем виде).. пришлось адаптировать один из скинов плагина под мою тему, чтобы не так заметно менюшку было.. разместил её в самом низу левого sidebar’а, там видно что 2 пунта меню, в одном 3 подменю, в другом 2 подменю, шапка на jQuery робит, т.е. значит библиотека подключена нормально… Если за это время никто ничего не подскажет придется на одном из серваков пробовать устанавливать старый WP 3.2.1. чтобы до конца исключить все возможные проблемы…
Скорее всего это плагин просто пока что не дружит с последней версией вордпресс
Чтобы народ не пугался )) по поводу этого плагина – обязательно отпишусь: наконец то я нашел в чем дело, я создал новый нулевой сайтик и поставил один только этот плагин JQuery Accordion Menu Widget – он заработал в т.ч. с моей темой и на последнем WP. Тогда я начал поочередно отключать уже на действующем сайте плагины и нашел плагин который конфликтовал с этим, вот его название Superb slideshow gallery. Уж не знаю что за конфликты между ними, но как я отрубаю плагин для слайдшоу – менюшка сразу же робит (само слайдшоу может даже нигде не задействовано – просто сам по себе активированный плагин конфликтует плагином менюшки)! Так что плагин робит на актуальной версии WP, Спасибо за плагин и Ваши ответы. Теперь буду думать как решить конфликты, если не разберусь, то буду решать от какого из плагинов отказываться ))
И Вам спасибо, что решили одну из проблем, и оставили, такие подробные комментарии
Спасибо Агромное!
Всегда рад
Меню не будет работать, если в footer.php не будет функции wp_footer();
Александр, вроде бы как в footer.php всегда есть такая функция wp_footer();
Доброго дня есть вопрос такого типа,как изнутри поменять цвет черный на красный,понятно его в установочнике нет,как сделать чтобы он был.Есть варианты?
Александр, скачайте плагин и попробуйте в css посмотреть плагина. Скорее всего там стоит фоновое изображение, которое и нужно поменять на необходимое.
Всё верно, в css плагина можно взять блэк-шкуру (black.css) и её изменить под себя – там и фон и цвет букв можно прописать и фоновые изображения в папке images нужно подменить. Можете глянуть как у меня на сайте эта менюшка выглядит, выше в моём предыдущем сообщение ссылку на сайт уже оставлял…
Не плохо придумали. Надо и у себя чё нибудь изменить
Не работает данный плагин, нету выпадающего меню. Версия WP 3.3.1 У кого нибудь возникали проблемы с данным плагином ?
Евгений, Вы всё так как в статье написано сделали?
С той лишь разницей что меню было создано раньше установки плагина. Подрубрики создал, родители у этих страниц указаны.
Могут ли стили в сайдбаре мешать корректной работе плагина. Я до стилей еще просто не добрался.
Всё возможно, ещё проблема может быть в шаблоне попробуйте изменить, чтобы проверить.
Алексей, где подредактировать, что бы можно было менять ширину менюшки, шрифты и тд?
Дамир, я Александр.
Вам нужно скачать этот плагин на компьютер. Далее в исходниках найти файл стилей style.css (возможно по другому называется) и там отредактировать то что нужно.
Извините =) Спасибо за ответ =)
а я хочу убрать меню из шапки и оставить только в сайт баре. что бы шапку сайта оно вообще не касалось !! что бы там как положено отображалось то что я хочу. как это сделать?
Станислав, это всё зависит от шаблона блога. Если меню в шапке нужно убрать, придётся лезть в код. Или посмотрите в настройках шаблона, возможно там его можно убрать.