Создание списка новостей/товаров

Для удобного и понятного отображения контента на сайте — будь то новости, товары или разделы — важно представить его в виде наглядного и удобного списка. Такой формат облегчает пользователям поиск нужной информации и упрощает взаимодействие с сайтом.

Создание смарт-списка новостей/товаров в CMS Smart Engine

Шаг #1. Перейдите в визуальный редактор шаблона, на котором планируется вывести список → в разделе «Элементы новости»/«Элементы каталога» (или в разделе «Элементы корзины», если список товаров нужен на системной странице «Корзина») на панели инструментов выберите и перетащите элемент «Список» в среду визуальной верстки. В примере выбирается список из раздела «Элементы каталога».

Шаг #2. Выберите тип элементов «Разделы», «Новости», «Товары» или «Корзина» (перечень доступных типов зависит от того, какой список был выбран на шаге #1). В примере выбирается тип элементов «Товары».

Шаг #3. Перейдите в настройки элемента.

Шаг #4. Во вкладке «Основные параметры» укажите, какие элементы выводить (например, «Товары раздела») → при необходимости выберите параметр «Цель» → укажите количество элементов в ряду.

Внимание! Если «Цель» не выбрана, тогда на страницах каждого раздела, где применяется один и тот же шаблон, внутри элемента смарт-списка будут отображаться товары именно этого раздела (в первом разделе — его товары, во втором — его). Если же выбрана «Цель», то на каждой странице раздела будут выводиться товары, соответствующие именно выбранной целевой группе, независимо от раздела. 

Шаг #5. Во вкладке «Вывод элементов» укажите, по сколько элементов подгружать. Дополнительные товары в смарт-списке будут подгружаться с помощью кнопки «Показать еще» либо без нее — при прокрутке экрана (автоматически, при долистывании до конца уже выведенных элементов).

Внимание! Выводить все элементы сразу не рекомендуется. Единовременная подгрузка большого количества элементов значительно замедлит загрузку страницы.

Шаг #6. Во вкладке «Кнопка "Показать еще"» укажите, нужна ли вам кнопка «Показать еще» → укажите размеры и оформление при необходимости.

Шаг #7. Перейдите в редактирование элемента смарт-списка.

Шаг #8. Перейдите в настройки → укажите ширину элемента → если верстка планируется адаптивная, включите адаптивность для элемента списка → нажмите кнопку «Сохранить».

Внимание! Если включена адаптивность элемента списка, указанная до этого ширина элемента становится условной единицей для удобства визуальной верстки самого элемента. Внутри шаблона со списком ширина будет автоматически подстраиваться в зависимости от общей ширины списка, количества элементов в ряду и отступов между ними. 

Шаг #9. Вернитесь к шаблону, где создан смарт-список. Теперь, когда элементы в списке адаптивны, можно задать необходимую ширину списка.

Поздравляем, список новостей/товаров размещен на вашем сайте!