Як сховати під спойлер


 

Спойлери у верстці веб-сторінок використовують для того, щоб візуально приховати частину об’ємного тексту, зображення або будь-якого іншого вмісту сторінки за посиланням. Щоб зробити спойлер в 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]

Зверніть увагу

Текст, що знаходиться всередині спойлера, можна містити html-теги, використання яких значно розширює можливості оформлення вмісту веб-сторінки.