WP eLDeR Quiz документация v1.4.x
ДокументацияСоздание квизаВнешний вид и отображение

Внешний вид и отображение

Цвета и высота настраиваются у каждого квиза отдельно; общие значения для всех квизов — во вкладке «Внешний вид» настроек плагина. Для тонкой доводки есть CSS-переменные.

Панель «Внешний вид» у квиза

НастройкаОписание
Основной цветКнопки, активные элементы, прогресс. Пусто — берётся из настроек плагина (по умолчанию фиолетовый #5c3bfe).
Цвет текста на кнопкахПо умолчанию белый.
Цвет фонаФон контейнера квиза. Два вспомогательных оттенка (карточки ответов, поля) плагин выводит автоматически — чуть светлее или темнее фона.
Цвет текстаОсновной цвет текста квиза.
ВысотаМинимальная высота контейнера, по умолчанию 600px. Работает в связке с форматом «слайды», чтобы квиз не «прыгал» по высоте между вопросами. Распространяется и на стартовый/финальный экраны (содержимое стартового центрируется по вертикали); на узких экранах (телефоны) высота не форсируется.

Формат вывода и прогресс

Панель «Настройки» квиза:

НастройкаЗначения
Формат вывода вопросовСлайды — по одному вопросу; Список — все подряд. См. сравнение.
ПрогрессНе показывать, полоса с процентами или счётчик «пройдено / всего». Только для формата «слайды».
Текст кнопки на последнем шагеЗаменяет «Далее» на последнем вопросе — например, «Узнать результат».
Можно менять ответРазрешает возвращаться и менять ответы (в тестах с мгновенной проверкой — выключено по смыслу).
Общий таймер квизаВремя на всё прохождение в секундах; по истечении квиз завершается принудительно. 0 — без таймера.

Общие настройки внешнего вида

Вкладка «Внешний вид» настроек плагина: значения по умолчанию для всех квизов (основной цвет, цвета текста и фона) и поле «Дополнительный CSS» — ваши стили, которые подключаются только на страницах с квизами.

Порядок приоритетов. Цвет, заданный у квиза, перекрывает общий из настроек; CSS-переменные из «Дополнительного CSS» или темы перекрывают и то и другое — см. полный список переменных.

Переопределение шаблонов

Разметку любого экрана можно заменить в теме: скопируйте файл из wp-elder-quiz/template-parts/ в ваша-тема/wp-elder-quiz/ и правьте копию. Подробности — в разделе для разработчиков.