Что внутри
- pkg_tabsaccordion.zip — установщик "два в одном" (рекомендуется устанавливать его).
- plg_editors-xtd_tabsaccordion.zip — сама кнопка редактора (обязательный плагин).
- plg_content_tabsaccordion.zip — плагин-компаньон: следит, чтобы на странице сайта был подключён JS Bootstrap (tab/collapse) там, где выводится блок «Табы» или «Аккордеон», даже если активный шаблон сам его не подключает (не обязателен, но рекомендуется).
Установка
1. Расширения → Управление → Установить → «Отправить файл и установить».
2. Загрузите `pkg_tabsaccordion.zip` — установятся сразу оба плагина.
3. Расширения → Плагины → убедитесь, что включены:
- Editor Button - Tabs & Accordion (группа «Кнопки редактора»)
- Content - Tabs & Accordion runtime (группа «Материалы»)
Обычно Joomla включает плагины сразу после установки, но стоит проверить.
4. Откройте любой материал — под окном редактора (там же, где кнопки «Изображение», «Разрыв страницы» и т.п.) появится кнопка «Табы / Аккордеон».
Плагин рассчитан на Joomla 5 и 6 с редактором TinyMCE (редактор по умолчанию в Joomla).
Как пользоваться
Вставка нового блока
1. Поставьте курсор в тексте материала, где должен появиться блок.
2. Нажмите «Табы / Аккордеон».
3. Выберите тип — «Табы» или «Аккордеон».
4. Заполните заголовки и содержимое вкладок. Кнопкой «+ Добавить вкладку» можно добавить ещё пункты, стрелками ↑/↓ — переставить их местами, «Удалить» — убрать вкладку (минимум 2 вкладки).
5. Отметьте «Открывать первый пункт по умолчанию», если нужно.
6. Нажмите «Вставить».
Редактирование уже вставленного блока
- Дважды кликните прямо по блоку в тексте редактора — откроется тот же диалог, но уже заполненный текущими вкладками.
- Либо поставьте курсор внутри блока и снова нажмите кнопку «Табы / Аккордеон».
- В режиме редактирования доступна кнопка «Удалить блок» — убирает блок из текста целиком.
Всё это работает через прямое обращение к API TinyMCE, поэтому распознавание "курсор внутри блока" и подсветка блока при наведении работают только когда активен именно TinyMCE. Для других редакторов (CodeMirror, «Нет редактора») кнопка вставляет блок как обычный HTML, но live-редактирование существующих блоков недоступно.
Как это выглядит на сайте
Вставляемая разметка — это стандартные компоненты Bootstrap 5 (`nav nav-tabs` / `tab-content` для табов, `accordion` для аккордеона), без собственных CSS-классов оформления. Если шаблон сайта уже собран на Bootstrap 5 (как большинство современных Joomla-шаблонов, включая Cassiopeia), всё отработает без дополнительной настройки — плагин `plg_content_tabsaccordion` сам подключает нужный JS (переключение вкладок, раскрытие пунктов) на страницах с такими блоками.
Если ваш текущий шаблон не на Bootstrap 5, потребуется либо переопределить оформление своим CSS под классы `.tabsaccordion-tabs` / `.tabsaccordion-accordion`, либо подключить Bootstrap на сайте — дайте знать, если нужно подготовить такой вариант.