A- A A+
Tabs

Куда Более продвинутое расширение по сравнению с плагином Uyguntabs, который был первым на блоге уроком по внедрению в контент табов (вкладок).

Карточка расширения Tabs

Дополнительная информация

Тип расширения: Плагин
Версия:  5.1
Совместимость: 1.5, 2.5, 3.0

Шаг 1. Установка плагина

Статья «Все способы установки расширений Joomla!».

Шаг 2. Настройки. Вкладка "Плагин"

Как всегда плагины от компании NoNumber включаются автоматически во время установки.

В менеджере плагинов открываем System - NoNumber Tabs. Здесь много отключенных параметров для PRO версии, которые мы естественно пропускаем.

Итак, раздел "Оформление":

Tabs
  • Загружать стили - Если "Да", табы будут оформлены стилями расширения. При выборе "Нет" можно использовать свои стили. Старые стили плагина присутствуют в демо расширения.
  • Выравнивание блока вкладок - Выберите способ выравнивания.
  • Цвет неактивного блока вкладок - Если "Да" фон не активных вкладок будет серого цвета.
  • Outline Handles, Outline Content - Границы и отступы вокруг содержимого вкладок.

Шаг 3. Настройки. Вкладка "Описание"

Здесь представлены шаблоны для вставки вкладок:


Заголовок

Содержимое вкладки...

Заголовок

Содержимое вкладки...

Tabs

Для создания ссылок на определенные вкладки следующий синтаксис:

Текст ссылки

Индивидуальный стиль вкладкам назначается созданными самостоятельно классами, или предустановленными: голубой (blue), зеленый (green) и серый (grey), оранжевый (orange) и красный (red). Синтаксис будет выглядеть так:

Заголовок

 или

Заголовок

, то есть класс разработчика.

Шаг 4. Настройки. Вкладка "Дополнительные параметры"

Раздел "Синтаксис тегов". Можете заменить используемые теги на любые другие названия.

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

Tabs

Далее можно выбрать тег формата заголовка вкладки, в случаях если табы не работают.

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

Tabs

Шаг 5. Настройки. Вкладка "Настройки кнопки редактора"

Tabs
  • Текст на кнопке - Например "Табы".
  • Включить на лицевой части - Кнопка на фронтенде сайта.
  • Use Simple Button - Оставляем "Нет".
  • Maximum number of Tabs - Максимальное количество табов показываемых редактором кнопки во всплывающем окне

Шаг 6. Создаем вкладки вставкой кода

Вставляем в материал следующий код:

Вкладка 1

ТЕКСТ

Вкладка 2

ТЕКСТ

Вкладка 3

ТЕКСТ

Tabs

Шаг 7. Создаем вкладки с помощью кнопки

Конечно, лучше создавать кнопки используя кнопку, которая расположена внизу редактора материалов.

Tabs

При нажатии появляется окно, в котором предельно просто создавать вкладки.

Tabs

Шаг 8. Последний

Открываем фронтенд с материалом.

Tabs

Вкладки на месте. Кстати, данное расширение давно используется на блоге в разделе "Карточка расширения".

 

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

Защитный код Обновить

Если заметили ошибку, выделите фрагмент текста и нажмите Ctrl+Enter

МОЙ TELEGRAM-КАНАЛ

ПОДПИСАТЬСЯ!


Перенос на хостинг

Перенос на хостинг

Бесплатный видео-курс по переносу готового сайта на одну из лучших хостинг-площадок РУнета.

Смотреть (бесплатно)

Бессмертный сайт

Бессмертный сайт

2 урока, 16 минут, и Ваш сайт - БЕССМЕРТНЫЙ!

Узнать подробности!