Возможности
← Ко всем возможностям
Продажи и маркетинг

Слайдеры и баннеры

Рекламные баннеры и карусели, которые вы собираете сами и ставите в любое место оформления.

Снимки экрана скоро появятся.

Первый экран магазина продаёт не хуже товаров, но обычно его правят через вёрстку. Плагин отдаёт баннеры вам: загрузили картинку, написали заголовок, указали, куда ведёт переход, — и слайдер готов. Ставится он по имени, поэтому одну и ту же карусель можно показать на главной, в карточке товара или в корзине.

Что делает

  • Собирает наборы слайдов: картинка, заголовок, описание, надпись на кнопке и адрес перехода. Ссылку можно открывать в новой вкладке.
  • Берёт отдельную картинку для телефона: широкий баннер на узком экране либо обрезается по краям, либо мельчает до нечитаемого. Не загрузите — покажется основная.
  • Гасит и включает слайды по сроку: у каждого свои даты показа, поэтому баннер акции появляется и исчезает сам, без вашего участия.
  • Даёт три готовых вида — баннер во всю ширину, лента карточек и лента логотипов — и настройки к ним: сколько слайдов видно на телефоне, планшете и компьютере, промежуток, высота, автопрокрутка с задержкой, показ по кругу, скорость, стрелки и точки.
  • Переводит весь текст слайда на языки магазина: заголовок, описание, надпись на кнопке и подписи к картинке, которые читают поисковые системы и незрячие покупатели.
  • Ограничивает слайдер отдельными витринами или показывает его на всех.
  • Порядок слайдов задаётся перетаскиванием, любой слайд можно временно выключить.
  • Вид карусели правится в редакторе оформления: разметка и стили кладутся в вашу тему, обновление плагина их не трогает.

Что нужно для работы

  • Поставить слайдер в оформление: в разделе «Слайдеры» для каждого набора показана готовая строка для вставки.
  • Больше ничего: карусель плагин приносит с собой, а если она уже есть в вашей теме — берёт её и не грузит второй раз.

Что появится в магазине

Так это увидит покупатель после установки.

  • В том месте оформления, куда вы поставите слайдер, появляется готовая карусель с вашими баннерами — с листалкой, точками и автопрокруткой. Слайдер вставляется по своему имени и по умолчанию нигде не показывается — добавьте его в редакторе оформления там, где он нужен. Вид карусели правится в том же редакторе, состав слайдов — в разделе «Слайдеры».
  • Отдаёт слайды оформлению как данные — картинки, заголовки и ссылки, — чтобы нарисовать их своей вёрсткой, не пользуясь готовой каруселью. Нужно только тем, кто правит оформление вручную и хочет свой вид блока. Готовая карусель при этом не подключается — разметку и оформление задаёте вы.

Слайдеры и баннеры

Рекламные баннеры и карусели, которые вы собираете сами, без вёрстки: загрузили картинку, написали заголовок, указали, куда ведёт переход.

Как вывести слайдер в магазине

  1. Откройте раздел «Слайдеры» и создайте набор. Кроме названия у него есть имя для вставки — короткая строка латиницей, например home-hero. Она подставляется сама из названия, но её можно поменять.

  2. Там же, в поле «Как поставить в магазин», показана готовая строка:

    {slider id="home-hero"}
    
  3. Скопируйте её и вставьте в оформлении магазина там, где слайдер должен появиться: «Дизайн» → редактор оформления, нужный шаблон. Чаще всего это главная страница (home.html), но подойдёт любое место — карточка товара, корзина, подвал.

  4. Сохраните шаблон и обновите страницу магазина.

Один и тот же слайдер можно поставить в нескольких местах — он везде покажет одни и те же слайды.

Если нужна своя вёрстка

Второй способ отдаёт слайды данными, а разметку вы пишете сами:

{slider_data id="home-hero" assign=hero}

{foreach $hero.slides as $s}
    <a href="{$s.url}">
        <img src="{$s.image}" alt="{$s.alt}">
        <span>{$s.title}</span>
    </a>
{/foreach}

В каждом слайде есть: url, blank, title, description, button, image, image_mobile, alt, image_title. Готовая карусель в этом случае не подключается — оформление целиком за вами.

Что настраивается у слайдера

  • Вид: баннер во всю ширину, лента карточек или лента логотипов.
  • Сколько слайдов видно — отдельно на телефоне, планшете и компьютере. Дробное значение (например 1,5) оставляет следующий слайд выглядывать за край, и покупателю сразу понятно, что ленту можно листать.
  • Промежуток между слайдами, высота, автопрокрутка с задержкой, показ по кругу, скорость, стрелки и точки.
  • Витрины: слайдер можно ограничить отдельными витринами или показывать на всех.

Что настраивается у слайда

  • Две картинки — для компьютера и для телефона. Широкий баннер на узком экране либо обрезается по краям, либо мельчает до нечитаемого, поэтому мобильная версия задаётся отдельно. Не загрузите — покажется основная.
  • Заголовок, описание, надпись на кнопке и адрес перехода (можно открывать в новой вкладке).
  • Описание картинки и подсказка при наведении — их читают поисковые системы и незрячие покупатели.
  • Срок показа: «показывать с» и «показывать по». Баннер акции появится и погаснет сам, без вашего участия.
  • Порядок слайдов задаётся перетаскиванием, любой слайд можно временно выключить.

Весь текст слайда переводится на языки магазина. Адрес перехода один на все языки — как и адреса страниц магазина.

Как поменять вид карусели

Разметка и оформление слайдера кладутся в вашу тему при первом показе:

  • templates/plugins/sliders/slider.html — разметка;
  • assets/plugins/sliders/sliders.css и sliders.js — вид и поведение.

Правьте их в редакторе оформления: обновление плагина эти файлы не трогает. Саму карусель плагин приносит с собой, а если она уже есть в вашей теме — берёт её и не загружает второй раз.

1.0.0 03.08.2026

Слайдеры и баннеры

Слайды с картинкой, текстом и ссылкой; выводятся в любом месте темы одним тегом.