Обзоры расширений Joomla

 

 

DJ-MegaMenu – это модуль горизонтального мега меню Joomla с большим количеством настроек и наличием мобильной версии. Вы сможете разместить любой модуль в подменю DJ-MegaMenu, гибко сконфигурировать внешний вид и анимацию элементов меню и подменю. Также будут доступны дополнительные опции по настройке каждого пункта меню из стандартного менеджера меню Joomla. Можно располагать подпункты меню в столбцах, оснащать их иконками и дополнительными надписями. Пример работы DJ-MegaMenu можно посмотреть на демонстрационном сайте разработчика.  DJ-MegaMenu ориентирован на поддержку стандартов WCAG 2.0 (раздел 508), что означает его повышенное удобство для людей с ограниченными возможностями. Подробнее об этом можно прочесть в статье «Обзор шаблона Joomla JM University. Как сделать версию сайта для слабовидящих».

Обзор будет проходить в последней, на момент написания статьи (01.07.2016), русскоязычной версии DJ-MegaMenu 3.4.1, Joomla 3.5.1 в шаблоне JM Real Estate Ads 1.0.2. Обратите внимание, что для DJ-MegaMenu есть более двух десятков готовых, профессиональных шаблонов сайта. О некоторых из них можете прочесть в предыдущих статьях.

Есть бесплатная версия данного расширения DJ-MegaMenu Free Edition и совсем урезанная версия DJ-Menu.

Особенности мега меню для Joomla

Рассмотрим основные особенности DJ-MegaMenu.

  • Возможность настройки каждого пункта меню отдельно друг от друга при помощи расширенных опций в менеджере меню Joomla. Не забудьте активировать плагин DJ-MegaMenu. Добавление иконок, подзаголовков, задание фона (изображение с указанием вертикального и горизонтального выравнивания), возможность показа\скрытия каждого отдельного пункта меню в мобильном или обычном меню. Так же можно задать ключ доступа, который позволит перемещаться в нужную часть страницы при помощи клавиатуры.
  • Возможность создания многоколоночного (с заданием ширины колонок), древовидного или обычного подменю (рисунок ниже).
DJ-MegaMenu
DJ-MegaMenu
  • Добавление иконок (Bootstrap или Font Awesome) к пунктам меню. Возможность отображения иконок в мобильном или обычном меню.
  • Добавление различных эффектов CSS3 анимации появления и исчезания (более 30). Настройка времени открытия и закрытия подменю. Настройка направления открытия и возможность раскрытия подменю по нажатию или наведению.
  • Добавление модулей в меню (рисунок ниже) (с заданием стиля отображения модуля).
Мега меню для Joomla
Мега меню для Joomla
  • Закреплённое меню. Возможность закрепить горизонтальное мега меню для Joomla в верхней части страницы при её прокрутке.
  • Возможность добавления логотипа в закреплённое меню, его выравнивания и настройки отступа.
  • Удобные настройки цветов элементов меню из административной части Джумла без необходимости правки CSS файлов.
  • Две предварительно настроенные темы оформления горизонтального меню.
  • Данный модуль меню Joomla адаптивный (отзывчивый). Полная поддержка работы с меню при помощи касания (тачскрины) и мобильных устройств iPhone, iPad, Android, Windows Phone.
Модуль меню Joomla
Модуль меню Joomla
  • Возможность выбора одного из нескольких типов мобильного меню с настройками каждого типа. Например, позиция, тема оформления (светлая и тёмная), выравнивание, логотип, наличие «off canvas» меню (выдвижного меню).
  • Возможность настройки цветов элементов мобильного меню из админки Joomla без необходимости правки CSS файлов.
  • Возможность настройки состояния мобильного подменю (свёрнуты, развёрнуты, развёрнуты все элементы подменю активного меню)
  • Возможность вставки модуля в «off canvas» меню.
  • Настройка «off canvas» меню (список или аккордеон), добавление логотипа. Наличие 14 эффектов. Возможность вставки кнопки открытия мобильного меню в любу часть страниц.
  • Полная поддержка навигации по меню согласно требованиям стандарта WCAG 2.0 (раздел 508) для людей с ограниченными возможностями.
  • Поддержка Joomla х м 2.5.
  • Плагин и модуль мега меню для Joomla переведён на русский язык.
  • Наличие русскоязычных всплывающих подсказок для опций модуля.
  • Хорошая документация и техническая поддержка (на английском).

Бесплатная версия DJ-MegaMenu

Есть бесплатная версия DJ-MegaMenu – DJ-MegaMenu Free Edition. Но есть ограничения бесплатной версии по функциональности:

  • Отсутствует возможность выбора цветов элементов мега меню и мобильного меню Joomla.
  • Нет возможности вставки модулей в меню и мобильное меню.
  • Нет возможности закрепления горизонтального меню Joomla в верхней части экрана.
  • Отсутствует возможность задания интервала задержки перед открытием подменю.
  • Нет возможности размещения кнопки мобильного меню в любом нужном месте шаблона.
  • Нельзя менять настройки каждого пункта меню для таких опций: ширина столбцов, тип подменю (дерево или спадающий список), направление раскрытия подменю.

Настройка модуля меню Joomla

По большому счёту, настройка DJ-MegaMenu аналогична настройке любого другого меню:

  1. Создаёте меню в менеджере меню.
  2. Создаёте пункты меню в этом меню.
  3. Устанавливаете DJ-MegaMenu.
  4. В настройках модуля DJ-MegaMenu указываете название созданного меню и публикуете модуль меню в нужной позиции шаблона.

Все остальные настойки и создание стилей – это тонкости.

Более «тонкие» DJ-MegaMenu разнесены по трём разным местам:

  1. Настройки модуля меню Joomla (в менеджере модулей). Тип «DJ-MegaMenu».
  2. Настройки модуля кнопки мобильного меню (в менеджере модулей). Тип «DJ-MegaMenu - Mobile Menu Button».
  3. Настройки каждого пункта меню в менеджере меню Joomla. Для того, чтобы они появились нужно активировать плагин «Системный плагин DJ-MegaMenu» в менеджере плагинов.

Настройки модуля меню Joomla разделены на три вкладки: Модуль, CSS3 анимация и опции скрипта, Настройки мобильного меню. Почти все опции оснащены дополнительными всплывающими подсказками (на русском языке) или понятны из названия. Будут рассмотрены только наиболее интересные, на мой взгляд параметры. Также не будут затрагиваться одинаковые для всех модулей и пунктов меню опции.

На первой вкладке Модуль (рисунок ниже) Вы задаёте название меню Joomla, которое нужно показывать. Также можете настроить опции вывода иконок и подзаголовков пунктов меню в зависимости от того, какое меню отображается у пользователя. Плюс, можно отключить\включить добавление Шрифтов Awesome. Это полезно в том случае, когда Вы используете иконки пунктов меню из Шрифта Awesome (набор стилей). Если этот набор уже подгружается шаблоном сайта или другим расширением, можно отключить для препятствия повторной загрузки стиля и оптимизации скорости загрузки сайта.

Настройка модуля меню Joomla
Настройка модуля меню Joomla

На вкладке CSS3 анимация и опции скрипта, в основном собраны настройки эффектов анимации меню (рисунок ниже). Тут же можно задать тип подменю (дерево или спадающий список), направление открытия, спадающего списка подменю, действие, при котором будет открываться подменю (нажатие, наведение) и включить\отключить улучшенную совместимость меню для управления с клавиатуры (WCAG 2.0 (раздел 508)). Обратите внимание, что некоторые из этих опций, например, Ширина столбца в пикселях, может быть переопределена для конкретных пунктов меню в настройках каждого из них в менеджере меню.

CSS3 анимация и опции скрипта
CSS3 анимация и опции скрипта

Вкладка Настройки мобильного меню (рисунок ниже) содержит опции, позволяющие сконфигурировать мобильную версию меню. Причём, выбирая один из 3-х «типов» мобильного меню, Вам будут доступны разные настройки.

Настройки мобильного меню
Настройки мобильного меню

Рассмотрим некоторые настройки пунктов меню в менеджере меню Joomla (рисунок ниже).

Настройка пункта меню в менеджере меню
Настройка пункта меню в менеджере меню

Тут Вы сможете добавить подзаголовок к пункту меню (на рисунке ниже это слово «adverts»), указать, в каком «типе» меню нужно показывать данный пункт меню или, например, задать иконку. Иконок достаточно много их можно посмотреть тут и тут.

Подзаголовок
Подзаголовок

Если Вы создаёте многоколоночное подменю, то для задания новой колонки нужно активировать опцию Начать новый столбец (точка разрыва) для того пункта меню, с которого хотите начать новый столбец. Вложенные в него пункты будут отображаться в этом столбце. Тут же можно задать ширину нового столбца в пикселях (она переопределит ширину, заданную в настройках модуля).

В этих настройках DJ-MegaMenu Вы сможете добавить фоновое изображение пункта меню, а также добавить модуль (создать позицию). Для этого достаточно в поле Позиция модуля или Позиция мобильного модуля (в зависимости от того, в какое меню Вы хотите добавить модуль) указать название позиции шаблона, из которой Вы хотите отображать модули в меню. Можно указать или существующую позицию, или произвольную. Если указали произвольную, то в настройках модуля, который хотите отображать в меню, укажите эту позицию в настройке Позиция.

В настройках модуля кнопки мобильного меню (рисунок ниже) ничего особого нет. Вы можете выбрать, какой модуль DJ-MegaMenu нужно активировать по нажатию на эту кнопку и можете задать суффикс CSS-класса модуля для задания внешнего вида кнопки.

Модуль кнопки мобильного меню
Модуль кнопки мобильного меню

Русификатор DJ-MegaMenu

Скачать русификатор DJ-MegaMenu.

 

Как видите, создать горизонтальное мега меню для Joomla с расширением DJ-MegaMenu достаточно просто. Ещё раз подчеркну, что оно очень хорошо адаптировано к мобильным устройствам и гибко настраивается даже без правки исходного кода. Если Вы применяете это расширение на сайте, где используется шаблон не от Joomla-Monster.com, то, возможно, дополнительно понадобится добавить CSS-стили для гармоничной интеграции данного горизонтального меню Joomla с общим дизайном сайта. А если применяется шаблон от Joomla-Monster.com, то достаточно в настройках модуля, для опций Тема (вкладка CSS3 анимация и опции скрипта) и Тема мобильного меню (вкладка Настройки мобильного меню) выбрать вариант переопределить из шаблона.

 

Полезные ссылки: