Для чого потрібен спойлер html?

Знаетете ви, що таке спойлер HTML? Створення сайтів користується попитом у багатьох. Деякі освоюють розробку інтернет-ресурсів самостійно, беруть інформацію з різних джерел. Є поняття, з якими їм доводиться стикатися вперше. Що таке спойлер і як його зробити на сайті без будь-чиєї допомоги? У цій статті ви дізнаєтеся про це.

приклад спойлераЩо таке спойлер?

Розглянемо спойлер HTML, який працює на будь-якій системі управління сайтом (CMS). Спойлер - це конструкція, що містить частину контенту сайту, яка спочатку прихована для користувача. Людина клацає на відповідне посилання і бачить весь контент. З цією метою використовується і спойлер HTML. Усе ще не можете зрозуміти, для чого приховувати якийсь шматочок статті? Найчастіше для зовнішньої прикраси ресурсу. Крім того, спойлер HTML роблять з деякою практичною метою. Наприклад, створений сайт, дизайн якого не передбачає розташування великої статті на головній сторінці. І якщо власник хоче, щоб ресурс просувався пошуковими системами, необхідний об`ємний контент. Ось тоді і виручає спойлер.

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

приклад спойлера



Давайте розберемося з тим, як зробити HTML-код спойлера. Код, який ви бачите нижче, слід розмістити між тегами head вашого HTML-файлу, якщо є бажання використовувати ваш спойлер на декількох сторінках інтернет-ресурсу. У тому випадку, коли треба буде застосувати його тільки на одній певній сторінці, можете помістити код між тегами body.

спойлер htmlТема спойлера і його тіло виглядає так:



html код спойлераОсновне зроблено, але поки наш спойлер не працюватиме повноцінно. Справа в тому, що вміст нашого HTML-спойлера залишається завжди відкритим. Щоб це виправити, потребутся CSS. додайте:

тег спойлерЯкщо зробите все, як тут описано, отримаєте працездатну конструкцію.

Спойлер для Joomla

Щоб зробити його, наприклад, в Joomla, можна скористатися плагіном під назвою Core Design Spoiler. Не забудьте про Core Design Scriptegrator, довантажувати всі необхідні бібліотеки. Завантажуйте їх у розробників з офіційних сайтів, потім включіть все в Менеджері плагінів. Для того щоб поставити спойлер, що приховує текст, укладіть необхідний фрагмент статті в тег спойлер ([spoiler]). В налаштуваннях можна вибрати його вид. Він може бути кнопкою або простий посиланням. Ще задаються умови його розкриття: при натисканні або в той момент, коли користувач буде наводити курсор.Спойлер для Joomla

Є три параметра, доступних в цьому тезі:

  • Title дає можливість вказати свій заголовок в лапках.
  • Action дозволяє вибрати дію, що відкриває спойлер.
  • Element задає вид спойлера (link - посилання, а button - кнопка).

Усередині тега spoiler допускається використання тексту з HTML-тегами.

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


Увага, тільки СЬОГОДНІ!


Поділися, будь ласка статтю
всього голосів: 177
Увага, тільки СЬОГОДНІ!