График работы: 10:00 - 19:00 Пн - Пт
Спойлер для Платформы LP можно настроить после приобретения исходных кодов по ссылке Скрипты для PlatformaLP.

Файлы ebody.html и head.html откройте в текстовом редакторе Блокнот.

Исходный код

Скопируйте в BODY исходный код из файла ebody.html.

Здесь slideToggle() — плавное открытие спойлера, в скобках можно задать задержку в миллисекундах. Например, slideToggle(300).

Редактор

Добавьте на страницу новый элемент Блок и задайте для него class=spparent. Для наглядности в примере он обрамлен синей рамкой.

Родительский блок спойлера

Добавьте Кнопку и задайте class=spoiler.

Кнопка спойлера

Настройте внешний вид на свое усмотрение.
В параметрах кнопки “Действие кнопки” переключите в положение “Ничего не делать”.

Параметры кнопки спойлера

Добавьте еще один вложенный Блок (зеленая рамка) в синий Блок и укажите class=spoiler-info.

Информационный блок спойлера

Настройте его содержимое на свое усмотрение (текст, формы и другие элементы).
Опубликуйте страницу и проверьте.

Пример

Вид в редакторе

Таким образом выглядит наш образец спойлера в редакторе. Вы видите его конечный результат сразу – это гораздо удобнее, чем верстать его через HTML-код.

Спойлер в редакторе Платформы LP

Вид на опубликованной странице

А здесь видим наш спойлер в действии на опубликованной странице.

Спойлер для лендинга Платформы LP

Приложение. Схема структуры

Схематичное представление спойлера в редакторе.

Структурная схема спойлера / аккордеона

FAQ

Контент виден при загрузке

Спойлер скрывает контент только после загрузки страницы. Это баг? Как его исправить?

– Это не баг, так задумано. Допустим, что у вашего посетителя по каким-либо причинам не сработает Javascript: ошибка в работе других скриптов, конфликт, блокировка утилитами и т.д. В таком случае, наш скрипт не сработает и не сможет развернуть блоки по клику на кнопке. А в нашем случае, если скрипт не сработает, то и блоки не скроются.
Но вы можете скрыть их при загрузке. Для этого в HEAD добавьте следующие стили.

Изменение иконки

Как сделать, чтобы иконка менялась при разворачивании и сворачивании спойлера?

Если хотите, чтобы иконка изменяла свое направление при развороте спойлера, тогда добавьте в HEAD следующие стили

где в скобках указано значение в градусах (180 градусов).

Обновление

Версия от 24.09.2017

Добавлено:

  • изображения будут прорисовываться даже если из FAQ применить скрытие контента до загрузки страницы;
  • поддержка неограниченно вложенных конструкций спойлера.

Версия от 14.10.2017

Добавлено:

  • иконку кнопки можно вращать на заданный угол при раскрытии/скрытии спойлера (например, ▲ или ▼);