Опубликовано автор в категориях Drupal.

superfish_expanded_ro
Очень часто у пользователей Drupal или верстальщиков, которые только начинают работать с системой возникает вопрос о добавлении выпадающего меню. На самом деле сделать это не сложно и можно внедрить меню типа Superfish в любую тему Drupal.

1. Скачиваем и устанавливаем файлы Superfish меню

Для начала вам нужно скачать файлы самого меню, они прикреплены в конце статьи. Потом содержимое архива распаковать в директорию вашей темы.

2. Создаем новую область вывода

Далее в info-файле темы вам нужно добавить новую область, которая будет отвечать за вывод меню. Для этого в список областей темы нужно добавить строку:

regions[superfish_menu] = Superfish Menu

После этого вам нужно отредактировать ваш файл page.tpl.php и добавить переменную вывода меню в контейнере в id #superfish в то место, где вы планируете выводить меню.

<?php if ($superfish_menu): ?>
  <div id="superfish"><?php print $superfish_menu; ?></div>
<?php endif; ?>

3. Подгружаем JS и CSS

Теперь вернемся к нашему info-файлу темы и добавим вызов скриптов и стилей для меню посредством следующего кода:

;Superfish Stuff

stylesheets[all][] = sf/css/superfish.css
stylesheets[all][] = sf/css/theme.css
scripts[]          = sf/js/superfish.js

И еще один небольшой «кусочек» кода нужно добавить между вашего page.tpl.php файла:

<script type="text/javascript">
  $(document).ready(function() {
    $("#superfish ul.menu").superfish();
  }); 
</script>

Теперь вам необходимо очистить реестр тем (перейти в Настройки сайта и нажмите кнопку «Очистить кэш данных», чтобы новый материал описанный в info-файле загрузился в реестр тем).

4. Создание и настройка меню

Осталось самое простое — построить новое меню Drupal. Для родительских пунктов нужно установить параметр «развернутый (expanded)» в конфигурационном экране меню. См. скриншот ниже, где для примера показывается вывод навигационного меню. Затем перейдите на страницу настройки блоков и добавьте нужное блок меню в область вывода superfish_menu.

5. Стилизуем меню

Кликните чтобы увеличить картинку

Кликните чтобы увеличить картинку

Для изменения оформления меню нужно править стили в файле sf/css/theme.css. Вот и все! Да, кстати, за идею спасибо — adaptivethemes.com.

Скачать архив с файлами меню

P.S. Мысли об иномарках…

Купив иномарку, некоторое время спустя мы начинаем задумываться, где взять хорошие оригинальные запчасти для своего автомобиля. При выборе запчастей для иномарок не хочется попадать на удочку пройдохам, поэтому лучше выбрать надежного поставщика с именем, например: можно довериться запчастям от компании Republic Air Group, клиентами которой являются крупнейшие импортеры автозапчастей в странах СНГ.

обслуживание и поддержка сайта цены какие где

20 комментариев к записи “Простой способ добавить выпадающее меню к любой теме Drupal”

  1. Vir Dignus

    спасибо за статью, пришлась очень к стати, делаю свой блог и тут встал вопрос по меню, а тут вы.
    ещё раз спасибо.

    Ответить
  2. dvman

    Благодарю, очень хорошая статья!
    Вопрос гуру — а если меню должно выскакивать вверх? где и чего надо исправить ?

    Ответить
    • Константин

      Если хочется что бы вверх выскакивало меню, нужно коогдинаты появления появляющегося блока просто поменять. По оси икс уменьшить.

      Ответить
  3. Vlad

    Всем привет!
    Вопрос dvman, актуален, если ктото знает поделитесь пожалуйста как сделать так чтобы меню выскакивало вверх?
    Спасибо!

    Ответить
      • Ольга

        Порядок действий — в точности как в статье
        Версия Drupal 7
        правда, у меня в теме кроме page.tpl.php есть еще и maintenance-page.tpl.php, причем есть только в maintenance-page.tpl.php
        Вставила код на всякий случай и туда, и туда
        В блоках superfish появился, но на сайте меню не выводится. При этом пишется
        Notice: Undefined variable: superfish_menu in include() (line 256 of /pub/home/academhost10/reka/sites/all/themes/mayo/templates/page.tpl.php).
        Это как раз та самая строчка, куда вставился кусочек кода

        Ответить
  4. Hiway

    Если сделал все как в статье и не забыли обозначить регион regions[superfish_menu] = Superfish Menu и файлы в теме, то попробуйте просто зайти в список тем в админке, чтобы обновился реестр тем, а также вычистить кеш.

    Ответить
  5. Владимир

    Приветствую! Подскажите, а можно ли Родительские пункты сделать некликабельными, при условии что само меню создано из Таксономии_меню. Спасибо!

    Ответить
  6. Stils

    У меня drupal 7 своя подтема zen (менял только css) сделал все как в статье, выходит ошибка Notice: Undefined variable: superfish_menu в функции include() (строка 77 в файле Z:\home\drupal7\www\sites\all\themes\zen\Stils\templates\page.tpl.php).

    в 77 строке у меня начинается

    Вставляю в самое начало хедера.
    Подскажите что делаю не так?

    Ответить
    • Hiway

      Stils Если вы сделали первое действие regions[superfish_menu] = Superfish Menu, о очистите кеш и обновите реестр тем. Ошибка которую вы получаете говорит о том, что определена переменная региона меню.

      Ответить
  7. Петр

    Stils

    У меня drupal 7 своя подтема zen (менял только css) сделал все как в статье, выходит ошибка Notice

    Все так же. Чистил раз 10 делал по другому — все даром — регион видит, переменную нет

    Ответить
  8. Dowran

    Можно ли добавить этот superfish в main-menu в теме bartik? И как это реализовать?

    Ответить
  9. Александр

    Здравствуйте!
    Сделал все как в статье, но почему то при наведение меню оно пропадает и не позволяет выбирать остальные пункты подменю. В чем может быть причина?

    Ответить

Оставить комментарий

  • (не будет показан)