--- metadata: - name: generator content: Diplodoc Platform v5.54.2 alternate: - https://yandex.ru/support/kit/ru/site-editor/sections/slideshow.md - href: ru/site-editor/sections/slideshow.md type: text/markdown title: Markdown version - href: ../../llms.txt type: text/markdown title: llms.txt --- > **Documentation Index:** Fetch the complete configuration index at https://yandex.ru/support/kit/ru/llms.txt # Слайдшоу Слайдшоу — это секция, в которой отображаются слайды с изображениями. Слайдшоу можно добавить на любую страницу интернет-магазина. ## Настроить секцию {#set-section} 1. Нажмите на секцию **Слайдшоу**. 1. В панели справа отредактируйте настройки:   #| || **Настройка** | **Описание** || || **Соотношение сторон** | Укажите соотношение сторон слайда: * **2:1 (для мобильной версии — 4:3)** * **5:2 (для мобильной версии — 4:3)** * **7:2 (для мобильной версии — 7:3)** * **5:1 (для мобильной версии — 5:2)** * **10:1 (для мобильной версии — 7:1)** * **На весь экран** — выберите, чтобы показывать слайд на всю ширину экрана. || || **Палитра цветов** | Выберите палитру цветов, которая будет использоваться для секции. Палитры цветов настраиваются на вкладке [Тема](https://yandex.ru/support/kit/ru/site-editor/themes.md#settings). || || **Автовоспроизведение** | Включите опцию, чтобы автоматически прокручивать слайды. || || Текст на слайдах | > || || **Выравнивание по горизонтали** | Выберите выравнивание по горизонтали: * **Слева** * **По центру** * **Справа** || || **Выравнивание по вертикали** | Выберите выравнивание текста по вертикали: * **Сверху** * **По центру** * **Снизу** || || **Отступ по вертикали** | Отступ от края баннера до текста при выравнивании по вертикали сверху и снизу. Минимальное значение — 0 пикселей, максимальное — 40 пикселей. || || Размеры секции | > || || **Растянуть секцию на весь экран** | Настройте расположение секции: * **Как в теме** — секция будет расположена в соответствии с настройкой на вкладке **Тема**. * **Да** — секция займет всю ширину экрана. * **Нет** — секция будет расположена ближе к центру экрана. || || **Отступ по краям на десктопе** | Настройте отступ секции от краев экрана для полной версии сайта: * **Как в теме** — секция будет расположена в соответствии с настройкой на вкладке **Тема**. * **Своё значение** — выберите значение для отступа. || || **Отступ по краям на телефоне** | Настройте отступ секции от краев экрана для мобильной версии сайта: * **Как в теме** — секция будет расположена в соответствии с настройкой на вкладке **Тема**. * **Своё значение** — выберите значение для отступа. || || **Отступ над секцией** | Выберите отступ над секцией: * **Двойной** — рекомендуется добавить, если сверху находится секция с фоном или нет секции. * **Обычный** — стандартный отступ между секциями. * **Нет** — секция соединяется вплотную с предыдущей. || || **Отступ под секцией** | Выберите отступ под секцией: * **Двойной** — рекомендуется добавить, если снизу находится секция с фоном. * **Обычный** — стандартный отступ между секциями. * **Нет** — секция соединяется вплотную со следующей. || |# 1. Добавьте один или несколько элементов **Слайд**. ## Слайд {#slide} Слайд — это элемент внутри секции **Слайдшоу**, на котором есть изображение и текст. ### Настроить {#set-slide} 1. Слева от названия секции **Слайдшоу** нажмите ![](../../_images/arrow-down.svg). 1. Выберите **Слайд**. Откроется правая панель управления настройками этого элемента. 1. Настройте отображение элемента: #| || **Настройка** | **Описание** || || **Ссылка** | Введите ссылку на товар или коллекцию. При нажатии на слайд произойдет переход по этой ссылке. Выберите, на что ссылка — **На баннер** или **На кнопку**. Задайте текст и цвет кнопки, если требуется. || || **Изображение или видео** | Загрузите изображение или видео, которое будет отображаться в полной версии интернет-магазина. Рекомендованный формат — 2:1. || || **Изображение или видео для телефона** | Загрузите изображение или видео, которое будет отображаться в мобильной версии интернет-магазина. Рекомендованный формат — 4:3. || || **Создать изображение** | Опишите изображение для генерации. Примеры промтов и результатов смотрите на странице [Примеры генераций для слайдов](https://yandex.ru/support/kit/ru/site-editor/sections/promty.md). {% cut "Советы для качественной генерации" %} Для качественной генерации используйте подробный промпт, где опишите последовательно: * Стиль изображения. * Модель, товар или объект. * Действие, позу или расположение. * Ключевые детали. * Локацию и время. * Цвет и атмосферу. * Фон и глубину. {% endcut %} Выберите формат: * **2:1 (для мобильной версии — 4:3)** * **5:2 (для мобильной версии — 4:3)** * **7:2 (для мобильной версии — 7:3)** * **5:1 (для мобильной версии — 5:2)** * **10:1 (для мобильной версии — 7:1)** * **На весь экран** — выберите, чтобы показывать слайд на всю ширину экрана. Изображение автоматически отобразится в полях **Изображение или видео** и **Изображение или видео для телефона** в выбранных форматах. || || Текст слайда | > || || **Размер текста**   | Выберите размер текста на слайдах: * **Маленький** * **Средний** * **Большой** || || **Заголовок** | Введите текст заголовка. || || **Толщина заголовка** | Выберите толщину заголовка: * **Regular** * **Medium** * **Semibold** * **Bold** || || **Подзаголовок** | Введите текст подзаголовка. || || **Толщина подзаголовка** | Выберите толщину подзаголовка: * **Regular** * **Medium** * **Semibold** * **Bold** || || Внешний вид | > || || **Цвет текста** | Выберите в палитре или укажите HEX-код цвета текста. || || **Цвет фона секции** | Выберите в палитре или укажите HEX-код цвета фона секции. || || **Затемнение фона** | Настройте затемнение фона слайда. || |# 1. (Опц.) Чтобы добавить еще слайд, в левой панели нажмите **Добавить элемент** и повторите п. 3. ### Перенести {#move-slide} Слева от названия слайда зажмите ![](../../_images/six-dots.svg) и перетащите его. ### Удалить {#delete-slide} Справа от названия нажмите ![](../../_images/delete.svg).   ## Обратиться в службу поддержки [Написать в чат](https://yandex.ru/chat/#/user/6c041b05-07a4-99cc-79be-8670b7aff93d){.button} [Написать письмо](https://yandex.ru/support/kit/ru/feedback.md){.button}