Как спрятать под спойлер

Автор: Май 19, 2016

Как спрятать под спойлер

Спойлеры в верстке веб-страниц используют для того, чтобы визуально скрыть часть объемного текста, изображения или любого другого содержимого страницы за ссылкой. Чтобы сделать спойлер в Joomla, воспользуйтесь специальном плагином.

Статьи по теме «Как спрятать под спойлер»Как открыть спойлерКак сделать свой сайт с текстомКак видеть скрытый текст

Инструкция

1В каталоге дополнений Joomla найдите и установите плагин Core Design Spoiler. Для корректной работы потребуется также плагин Core Design Scriptegrator, который автоматически загрузит JS-библиотеки (Highslide, jQuery и другие). После установки включите оба дополнения через «Менеджер плагинов».

2Теперь вы сможете добавить спойлер со скрытым содержимым, заключив его в тег [spoiler]. Такой тег можно добавлять не только в обычные статьи Joomla, но также и в материалы компонентов каталога, к примеру в K2, ZOO, FLEXIcontent и т.д.

3Выберите в настройках плагина способ отображения спойлера. Это может быть как простая ссылка, так и кнопка. Укажите также и условие, при котором спойлер будет раскрываться – при клике или наведении курсора.

4Кроме указанного способа, любой из параметров можно указать и вручную, в теге [spoiler]. Вид спойлера можно задать параметром element, указав значение link для отображения в виде ссылки или button – для кнопки.

5Действие, при котором спойлер будет раскрыт можно обозначить через параметр action, для которого еть допустимые значения hover (по наведению курсора) или click (по клику). Уникальный заголовок спойлера можно создать с помощью параметра Title, указав необходимое значение в кавычках.

6Например, если вам нужно сделать спойлер с заголовком «Читать продолжение истории», который будет открываться по клику на ссылку с текстом заголовка, используйте следующий тег:
[spoiler title=»Читать продолжение истории» action=»click» element=»link»]

7После этого тега поместите текст или изображение, которые нужно спрятать, а затем «закройте» спойлер тегом:
[/spoiler]

  Рубрики Арт и Дизайн

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

*

Перед отправкой формы:
Human test by Not Captcha