Плагин аккордеона для joomla

Плагин Tabs & Slider & Spoilers

Универсальный плагин контента, который объединяет в себе 3 функции — табы, спойлер и слайды (вид гармошки)

  • Теперь не нужно использовать по 3 плагина для разных эффектов — всё в одном!
  • Очень мало весит
  • Специальные теги для вставки

Табы, Спойлер и Аккордеон для Joomla

Возможности

Простой плагин для Joomla 2.5 — 3.x, с помощью которого вы сможете преобразить ваш контент. Данный плагин работает только с com_content в полном материале. Может работать в любом компоненте, который поддерживает контентные плагины, например, в Joomshopping есть такая возможность.

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

Настройки

Если вы, предположим, для табов уже используете какой-то другой плагин, то вы можете отключить в настройках данную функцию во избежании конфликтов и пересечения по стилям с другими расширениями. То же касается и других функций, — можно включить только то, что будете использовать

Обратите внимание, для корректной работы плагина требуется подключение библиотеки jQuery. Если на вашем сайте отсутствует данное подключение, то вы можете в специальное поле ввести нужную версию, например, 1.1.8 и jQuery данной версии будет подключена с CDN Google автоматически. Для того чтобы проверить нужно ли вам использовать данную опцию, нажмите ctrl+u и посмотрите в исходном коде. Крайне нежелательно подключать библиотеку дважды, поэтому стоит внимательно отнестись к данному моменту.

Читайте также:  Дизайн гостиной с пианино

Источник

Плагин аккордеона для joomla

Меню в формате «аккордеон» отличается от обычных списков тем, что при нажатии на пункт раскрывается дополнительная информация или ещё один список. Такая форма предпочтительней, поскольку без необходимости не загромождает экран. Эта отличительная характеристика аккордеонного меню особенно актуальна, если сайт просматривают через мобильные устройства.

Сегодня существует множество модулей и компонентов, которые позволяют создать подобный тип меню, но не все из них имеют типичный вид. В истинном понимании аккордеон среди компонентов джумла встречается лишь среди modules для вывода контента (например, sp accordion). Так называемые «мобильные» представляют собой одну кнопку, при нажатии на которую раскрывается всё меню. Более функциональные приложения позволяют добавлять пользовательское описание, которое отображается под заголовком (не раскрывается при нажатии, а видно сразу) или даже вставить модуль joomla. А некоторые разработки выводят раскрывающийся список с красивыми иконками.

Какой выбрать вам – станет ясно после нашего обзора. Представляем топ-6 аккордеон меню для joomla 3.

Модуль AccordeonMenuCK

Интересная разработка – позволяет не просто создавать меню аккордеон joomla, а создавать пункты с картинками, пользовательским названием и описанием, со ссылками. В пункт меню можно даже вставить module joomla. Приложение позволяет настроить анимированные эффекты – различные способы раскрытия подменю.

  • Поддерживает 3.х джумла (есть версии для 2.5).
  • Отзывчивый.
  • Бесплатный (версия free, на сайте разработчика можно найти пакет pro).

Возможности

  • Описание вставляем после названия ссылки, отделяя его двумя «слэшами» (//). Модуль можно загрузить по ID (в заголовок ссылки): [modid=IDOFMODULE].
  • Изображение можно вставить с текстом или без него.
  • На одной странице можно разместить множество меню формата аккордеон.
  • Уровень вложенности может быть разный (количество не ограничено).
  • Работать с СЕО меню можно через CSS.
  • Множество предустановленных тем (с плагином Params) и возможность изменения стиля оформления.
  • Пункты меню с описанием и кнопкой далее можно создать из статей, проранжированных по дате, из статей определенной категории, из контента популярных компонентов (см. далее).
  • Интеграция с Flexicontent, Hikashop (с соответствующим патчем), Virtuemart (скачав патч).
  • Специальное меню для мобильных приложений (доступно после установки отдельного модуля).
  • Для сайтов на joomla предусмотрена дополнительная возможность для вывода: не только с помощью модуля, но в любом месте шаблона с помощью спецпозиции – «ici ‘maximenuCK’».

Настройка

Скачаем установочный файл с портала joomla.org(https://extensions.joomla.org/extensions/extension/structure-a-navigation/menu-systems/accordeon-menu-ck) и создадим меню. Для этого зайдем в модуль, перейдем сразу к вкладке Source (Источник).

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

Перейдём к эффектам, выберем один из множества эффектов перехода.

Зайдём во вкладку Styles. Если хотим выбрать один из 20 готовых шаблонов оформления, стоит установить плагин Params (достаточно выбрать наиболее подходящий для нашего шаблона, но можно произвести и более тонкие настройки стиля).

В следующей вкладке можно настроить границы, тень, отступы, углы и фон окна меню.

В других двух вкладках – стили ссылок разных уровней (1-го, 2-го и последующих).

Остальные параметры доступны после загрузки дополнительных патчей и плагина.

Получилось обычное меню, попробуем добавить описание, как советует разработчик. Для этого зайдём в менеджер меню, выберем то, которое у нас указано в качестве источника. Откроем первый пункт – Главная – и через двойной «слэш» пропишем описание. А в следующий пункт добавим модуль с помощью кода с идентификационным номером. Далеко не любой модуль можно вставить в аккордеонное меню таким способом, но некоторые всё таки работают внутри пунктов.

Разработчик предлагает получить дополнительные возможности по использованию меню «Аккордеон», скачав плагин Params или компонент «Голосование по JED». А чтобы лучше разобраться в возможностях Accordeon Menu CK, предлагает платно скачать всю документацию по модулю.

Расширение swMenuFree

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

  • Данное приложение поддерживает joomla 2.5-3.х (есть версии для 1.5 и для 1.0).
  • Отзывчивое.
  • Бесплатное (версия free, на сайте разработчика можно найти пакет pro).

Обзор настроек и возможностей:

  • Несколько языковых пакетов, включая русский (к сожалению, не всегда срабатывает).

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

  • Множество настроек для точечных изменений стиля (шрифты, оформление углов, границ, цвета, изображения, тень, границы).

  • Перед или после пункта меню можно поместить пользовательский код cssили html.

  • Функция предварительного просмотра (отображает последние изменения) – удобно при работе.

  • Настройки для «адаптивного» меню (отображение на мобильных устройствах в формате аккордеона).

  • Горизонтальная и вертикальная ориентация.

  • Интеграция с Virtuemart.
  • Обновляется до следующей версии без потери настроек.

Настроим меню и опубликуем через активацию соответствующего модуля.

Единственный минус расширения – отсутствие поддержки и демо (имеется лишь сложная видео инструкция не на русском языке).

Модуль Simple Responsive Menu

SRMenuавтоматически (при изменении размеров экрана, браузера) убирает все пункты, прячет их под одной кнопкой. Работает только на адаптивном шаблоне джумла.

Настройки

Настроить можно ширину экрана, при которой развернутое меню должно свернуться. А также указать место, где должна расположиться кнопка.

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

Приложение эффективно выполняет своё назначение и оправдывает название – Simple: настройка производится быстро.

Модуль Floating Buttons

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

  • Имеется в свободном доступе (лицензия GPLv2).
  • Подходит для Joomla 3.x.
  • Адаптивный.

Скачаем здесь: https://extensions.joomla.org/extensions/extension/style-a-design/modules-panel/floating-buttons. Установим и зайдем в автоматически созданный модуль FloatingButtons. Здесь можно настроить стиль, цвета, иконку, разрешить показывать на всех устройствах, либо только на мобильных. А также прописать для каждого пункта заголовок, url, выбрать для них иконку и цвета.

Модуль JF Mobile Bar

Назначение модуля соответствует названию, но JFMobileBarбольше, чем меню для мобильных устройств – оно работает и на планшетах, и на смартфонах, и на ПК.

  • Последняя версия предназначена для joomla 3.x, предыдущая – 2.5.
  • Распространяется бесплатно.
  • Отзывчивый красивый дизайн.

Возможности и настройка

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

Цветовое оформление можно менять. Доступны иконки.

Поддерживает расширения для соцсетей – EasySocialи JomSocial (можно добавлять ссылки на профили). Но для них требуется установка спецмодулей.

Ссылка на установочный файл: https://extensions.joomla.org/extensions/extension/structure-a-navigation/menu-systems/jf-mobile-menu. Все настройки в первой вкладке модуля: источник, название меню, размеры, при которых будет отображаться аккордеонное меню, цветовое оформление, названия пунктов, иконки.

После настроек получаем одинаковый вид на компьютере, планшете и смартфоне (если в параметре Show on device указали All, а если любую из других настроек — на компьютере меню будет отображаться полностью, не аккордеоном).

После изучения наиболее популярных разработок становится ясно, что под accordion menu joomla чаще понимают «мобильные» меню, реже раскрывающиеся (ниспадающие) списки. При этом каждый модуль или компонент имеет свои плюсы и оказывается очень кстати на сайтах определённой тематики.

Модуль DJ-SelectMenu

Простая, но уникальная разработка. Позволяет выводить пункты списком (выпадающее меню).

  • Лицензия GPLv2 (free).
  • Адаптивный.
  • Для версий 2.5-3.х (последнее обновление в январе 2016 г.)

Источник

Оцените статью