Перейти к основному содержимому

Сторис

Слайдер со сторис выводится, например, на Главной странице сайта https://tavrida.art/.

При нажатии на стори открывается слайдер с одним или несколькими слайдами.

Чтобы наполнить слайдер контентом необходимо:

  1. Создать слайды во вкладке "Слайды" раздела "Сторис".

  2. Создать стори во вкладке "Сторис" того же раздела, и присоединить к ним нужные слайды.

  3. В главной странице в блоке "Сторис" выбрать стори, которые должны отображаться на странице.

Раздел "Cторис"​

CMS --> Сторис --> Вкладка "Сторис"

Сторис CMS

к сведению

В данной вкладке выводится таблица со всеми ранее созданными сторис. Если сторис ранее созданы не были, таблица будет пустой.

Для создания новой стори необходимо нажать кнопку Добавить в правом углу экрана.

По нажатию кнопки Добавить, откроется карточка стори с полями для заполнения.

Для создания стори необходимо заполнить обязательные поля:

  • Техническое название
  • Изображение
осторожно

Можно создать сторю без слайдов, но такие сторис не будут выводиться на Главной странице, даже если выбраны в настройках блока на странице.

Чтобы в сторю добавить слайды, их необходимо завести на вкладке "Слайды".

Для удаления ранее созданной стори необходимо зайти в карточку этой стори и нажать кнопку с тремя точками.

Удаление стори

Подраздел "Слайды"​

CMS --> Сторис --> Вкладка "Слайды"

к сведению

В данной вкладке выводится таблица со всеми ранее созданными слайдами. Если слайды ранее созданы не были, таблица будет пустой.

Для создания слайдов необходимо перейти на вкладку "Слайды" и нажать кнопку Добавить в правом углу экрана.

По нажатию кнопки Добавить, откроется карточка слайда с полями для заполнения.

Для создания слайда необходимо заполнить обязательное поле:

  • Техническое название

Все созданные слайды должны быть добавлены в соответствующую им сторю.

Для удаления ранее созданного слайда необходимо зайти в карточку этого слайда и нажать кнопку с тремя точками, далее - Удалить.

Картинка слайда​

Для фона установлено соотношение сторон 750x1624. Именно такое соотношение сторон у самого высокого мобильного устройства (iPhone 15 Pro) и соответственно у самого высокого слайда в мобилке.

подсказка

Всегда обрабатывайте изображение в попапе обрезки.

На планшете и десктопе всегда фиксированный фрейм​

См. скриншот ниже, 375х635 означает, что загруженная и обрезанная до 750х1624 картинка влезет лишь на 1270px по высоте.

фрейм на десктопе

Зачем тогда x1624?​

На телефоне ситуация другая. Вьюпорты у телефонов могут быть разной высоты. На гифке ниже отражен диапазон высот от самой низкой до самой высокой - как раз 1624.

Длинное название (5 строчек), превышен лимит на текст (302 символа), расположение по центру:​

Диапазон, если контент по центру

Длинное название (3 строчки), превышен лимит на текст (302 символа), расположение снизу, и главное есть Key Visual:​

Диапазон, если контент прижат к низу

Если высота картинки 1624px, то размеры внутри следующие:

  • Сверху должен быть отступ под шапку с прогресс-баром и кнопкой закрытия. 128px.
  • Все остальное на глаз =(

Добавление сторис на Главную страницу​

Необходимо открыть Главную страницу в Редакторе контента.

CMS --> Редактор контента --> Вкладка "Страницы" --> Главная | ...

Выбрать на боковой панели справа, в навигации, блок "Сторис".

Стори на Главной странице

Для добавления сторис необходимо нажать кнопку Редактировать.

Выбор стори

И из выпадающего списка выбрать ранее созданные сторис.

Далее необходимо в правом углу блока нажать кнопку - Готово и кнопку Опубликовать

Сторис опубликованы на Главной странице сайта.