КАК СДЕЛАТЬ СЛАЙДЕР ИЗ ЗЕРО БЛОКОВ В ПОПАП?

• Внутри Зеро-блока привязываешь классы для кнопок, которые выполняют роль переключения (вперед и назад — например, #next и #prev);
• Если в зеро блоке есть элементы выполняющие роль: табов, нумерации или пагинации, то на каждый элемент указываешь ссылку, как в поле «Ссылка для табов» + порядковый номер, по итогу у нас должно получится, например, 3 элемента с ссылками: #bullet1, #bullet2, #bullet3;
• Дублируешь слайд и меняешь описательный контент или дублируешь настройки во все Зеро-блоки, которые выполняют роль слайдов;

• «id блоков через запятую» — копируешь id всех блоков, которые выполняют роль слайдов и указываешь их в данном поле через запятую (например, #rec0001,#rec0002);
• «Проигрывать sbs-анимацию только один раз при переключении» — анимация будет воспроизводиться один раз при первом попадании на слайд, повторно анимация не будет воспроизводиться;
• «Бесконечный слайдер» — например, у вас 3 блока, когда будете нажимать стрелку вперед, слайдер будет переключаться с 3го на 1ый;

• Положение стрелок: ←→ Лево право (Растянутые), ↖ Лево Верх (Стрелки рядом), ↗ Право Верх (Стрелки рядом), ↘ Право Низ (Стрелки рядом), ↙ Лево Низ (Стрелки рядом), ↑ Верх (Стрелки рядом), ↓ Низ (Стрелки рядом)
• Положение стрелок на мобилке: ←→ Лево право (Растянутые), ↖ Лево Верх (Стрелки рядом), ↗ Право Верх (Стрелки рядом), ↘ Право Низ (Стрелки рядом), ↙ Лево Низ (Стрелки рядом), ↑ Верх (Стрелки рядом), ↓ Низ (Стрелки рядом)
• Размер стрелки (px)
• Размер стрелки на мобилке (px)
• Размер кнопки (px)
• Размер кнопки на мобилке (px)
• Тип стрелки: Треугольник или Указатель
• Толщина стрелки (px)
• Толщина стрелки на мобилке (px)
• Стрелка: цвет
• Цвет при наведении
• Стрелка: цвет фона
• Цвет фона при наведении
• Непрозрачность фона
• Непрозрачность фона при наведении
• При наведении увеличение
• Настройка расположения: Window или Grid
• Показывать обводку
• Отступ между собой (px)
• Отступ снизу/сверху (px)
• Отступ справа/слева (px)

• Размер активной точки (px)
• Размер неактивной точки (px)
• Цвет фона
• Цвет фона активной точки
• Толщина обводки (px)
• Цвет обводки
• Цвет обводки активной точки
• Непрозрачность активной точки
• Непрозрачность неактивной точки
• Черно-белый фильтр активной точки
• Черно-белый фильтр неактивной точки
• Положение точек: ← Лево, → Право, ↑ Верх, ↓ Низ, ↖ Лево Верх, ↗ Право Верх, ↙ Лево Низ, ↘ Право Низ
• Положение точек на мобилке: ← Лево, → Право, ↑ Верх, ↓ Низ, ↖ Лево Верх, ↗ Право Верх, ↙ Лево Низ, ↘ Право Низ
• Отступ между собой (px)
• Направление точек: Горизонтально или Вертикально
• Отступ снизу/сверху (px)
• Отступ справа/слева (px)
• Скрыть на мобилке
• Добавить миниатюры

• «Скорость анимации» — выбираешь скорость анимации: 0, быстро или медленно;
• «Включить свайп мышкой на ПК версии» — отмечаешь галочку, если хочешь, чтобы на ПК слайдер листался свайпом;
• «Отключить свайп на мобилке» — если отметить галочку, то слайды не будут переключаться свайпом, только контроллерами;

После того как настроили все слайды, нужно настроить попап, в котором будут показываться слайды:

• «Ссылка для открытия popup» — Придумайте ссылку для открытия всплывающего окна (попап), а затем укажите ее в кнопке. Важно чтобы ссылка начиналась с символа #. Например, можно использовать ссылку вида "#openpopup".
• «Класс для закрытия popup» — В этом поле нужно придумать класс, который наоборот закроет вашу попап форму, только класс должен быть без символа #. Например closepopup.

Что бы указать класс у элемента, нажимаешь на него правой кнопкой мыши и выбираешь из списка последнюю строку "Add CSS Class Name", далее, справа в настройках указываешь тот же класс, что и в генераторе.

• «Затемнение фона» — Если выбрать пункт "Да", то в генераторе появятся дополнительные поля, в которых можно настроить 2 поля:
• «Цвет фона» — Цвет затемнения фона;
• «Непрозрачность» — Непрозрачность: затемнения фона.

• «Z-index стандартной плашки с ошибкой» — В этом поле нужно настроить z-index для уведомления с ошибкой. Z-index простыми словами это слои, как в торте. Значение указывается цифрами, чем больше цифра, тем выше будет находиться слой. Значение для плашки с ошибкой должно быть больше, чем значение для слайдов, чтобы слайды не перекрывали уведомление с ошибкой и пользователь понял, где допустил ошибку.
• «Z-index слайдов» — Эта настройка для слайдов / шагов формы. Z-index для слайдов уже настроен по умолчанию, чтобы попап открывался в самом верху слоев и перекрывал другие элементы, поэтому вы можете пропустить данную настройку, если только вы не указали более высокое значение для других блоков. Значение для плашки с ошибкой должно быть больше, чем значение для слайдов, чтобы слайды не перекрывали уведомление с ошибкой и пользователь понял, где допустил ошибку.

• «Не блокировать скролл» — При активации данной функции, пользователь сможет прокручивать страницу при открытом попапе.
• «Не закрывать попап при клике на фон» — Функция помогает если в слайдах есть форма и чтобы попап не закрылся при случайном клике на фон важно включить эту функцию.

• В генераторе в поле для табов пишешь просто #bullet, ссылки с нумерацией #bullet1, #bullet2 и т.д. указываешь уже внутри ваших кнопок;
• Ссылки у табов должны быть во всех блоках. К примеру, у нас 2 слайда, внутри каждого есть 2 кнопки. В обоих слайдах у каждой кнопки прописаны ссылки #bullet1 и #bullet2;
• Модификация не работает, если внутри слайдов есть элементы «галерея»;
• Модификация не работает вместе с блоками меню ME602 и ME603.
• Если нужно добавить ссылку для открытия определенного блока, к кнопке открытия добавь "-номер слайда". Например, чтобы открыть 3й слайд по отдельной кнопке, ссылка будет такой: #open-3. Внимание! Если используете блок t178 (плавный скролл до якорной ссылки), то ссылка для вызова нужного слайда должна начинаться с #popup, например: #popupopen-3.