Темизация выпадающего меню модуля Nice menus

Для меня всегда была проблема темизировать выпадающие меню из-за их глючности в разных браузерах. Наконец-то разобрался с устройством нормального кроссбраузерного меню Nice menu из аналогичного модуля для друпала.

Ставим модуль отсюда http://drupal.org/project/nice_menus
Заходим admin/settings/nice_menus , ставим кол-во блоков = 1, я еще отключаю скриптование.
Заходим в блоки, ставим появившийся блок nice_menu_1 в нужный регион, сохраняем. Заходим в настройки блока, там выставляем заголовок блока , menu_parent = Primary Links, menu style = down
Сохраняем, радуемся выпадающему меню.

Далее его надо темизировать. Копируем файл sites\all\modules\nice_menus\nice_menus_default.css в папку с css вашей темы. Далее заходим в глобальные настройки тем друпала здесь: /admin/build/themes/settings/global и в новом пункте настройки "Path to custom Nice menus CSS file" указываем путь до нашего скопированного css файлика, у меня он например такой:
sites/all/themes/aksioma_windows/css/nice_menus_aksioma_windows.css

Все, теперь редактируем наш css файл как хотим и получаем результат.

Для более легкого понимания принципов оформления я для себя сделал другой шаблонный css-файл, в котором убрал все ненужное, оставил только настройки для выпадающего вниз меню и добавил свои комментарии. Он в прикрепленном файле. Так же прикрепяю результирующий файл, вдруг пригодится тоже.

Если вы используете тему Zen и возникли проблемы с выпадением меню (когда оно прячется за контент), то решение проблемы я написал здесь: http://nikita-petrov.com/drupal/vypadayushchee-menyu-zen-theme-na-primer...

Прикреплённые файлы: 
Drupal 6, 7

Комментарии

Гость 01.11.2011 - 08:43

Здравствуйте, не подскажите как сделать горизонтальное меню полностью раскрытым с помощью найс меню(звучит может глупо, т.к. найс меню специально заточен под раскрывающиеся меню), но вот такая вот у меня задача возникла. Спасибо заранее

Nikita Petrov 19.04.2012 - 12:39

Просто найдите в css стили, дополненные :hover, и это слово :hover просто удалите. Т.е. например li a:hover -> li a
в результате Меню будет отображаться будто бы вы навели мышку сразу на все пункты, т.е. как раз оно раскрыто будет.

Александр 17.12.2012 - 16:36

"Если вы используете тему Zen и возникли проблемы с выпадением меню" - как раз моя проблема, а ссылка битая, не поможете?

Гость 13.12.2013 - 08:07

Здравствуйте. А как на примере Ваших css файлов прописать чтобы второй уровень меню выпадал в горизонтальную линию под первым уровнем?

Nikita Petrov 13.12.2013 - 15:05

Здравствуйте! Для этого вам надо знать css и применить соответствующие стили ко второму уровню меню (т.е. к ul.nice-menu-down li ul), навскидку я бы добавил ul.nice-menu-down li ul li { display:inline-block; margin-right:2em;}, возможно еще нужно будет указать ширину блока ul.nice-menu-down li ul {width:960px; top:0; left:0; }. В общем, изучайте подробнее css оформление.

Евгений 17.01.2014 - 13:48

Никита здрасте. Очень помогла статья. Я несколько часов парился с template.php и функциями. А тут за 5 минут готовое решение. Действительно класная и простатя статья

Nikita Petrov 17.02.2014 - 23:59

Какой дизайн вы имеете ввиду? Что конкретно вам показалось кривым?

Александр 18.02.2014 - 01:47

Да уж, в чем кривизна-то?
P.S. Никита, Вы, кстати, с js или jquery/ajax дружите?

Nikita Petrov 18.02.2014 - 07:33

Дружу конечно. По ajax в друпале целый фреймворк есть, нативный ajax практически нет нужды использовать. А так на jQuery очень часто приходится добавлять какие-нибудь фичи. Есть вопрос по ним? Задавайте, попробую ответить.

Хороший 05.08.2015 - 12:30

Делаю на друпале с помощью Nice menu стандарное горизонтальное ниспадающее меню, где каждому пункту горизонатльной плашки соотвествуют менюшка из вертикальных. Почему-то по умолчанию границы активного меню вплотную прилегают к тексту. Как задать фиксированный отступ? В друпале и css новичок....

Добавить комментарий