Редактор макета

Редактор макета используется для создания красивых, функциональных страниц на сайте интернет-магазина. Страницы создаются из готовых блоков – микрошаблонов. Каждый микрошаблон содержит блоки и плагины.

Структура микрошаблонов

Микрошаблоны (на рисунке выделены красным) состоят из блоков (на рисунке выделены синим).

Расположение блоков в микрошаблоне зависит от устройства – компьютер, ноутбук, планшет или телефон (горизонтально-ориентированный и вертикально-ориентированный). Вы можете настроить расположение и размер блоков в микрошаблоне для каждого из устройств.

В блоках располагаются плагины (на рисунке выделены желтым), которые содержат информацию и/или функциональность. Плагины располагаются друг под другом. В одном блоке чаще всего располагается один плагин, но их может быть и больше.

Микрошаблоны расположены друг под другом. Их можно менять местами с помощью соответствующих элементов управления.

Блоки можно менять местами в рамках микрошаблона с помощью перетаскивания. Для этого нужно навести курсор мыши на блок, после чего на нем появится специальная метка, за которую его можно перетащить.

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

Если выделить плагин, нажав на него мышкой, справа внизу экрана появится элементы управления – «Удалить», «Свойства», «Редактировать».

При удалении плагина удаляется блок если плагин в блоке один. Точно так же удаляется микрошаблон если в нем удаляется последний блок.

В свойствах можно настроить свойства плагина, блока в котором он находится и микрошаблона в котором находится блок.

Свойства плагина

ID – генерируется автоматически (его можно изменить) и используется при написании программной логики (скриптов).

Классы CSS – классы таблиц стилей CSS, которые можно создавать в «Редакторе стилей».

Свойства блока

ID – генерируется автоматически (его можно изменить) и используется при написании программной логики (скриптов).

Классы CSS – классы таблиц стилей CSS, которые можно создавать в «Редакторе стилей».

Расположить в центре – специальная опция, позволяющая расположить в центре весь блок.

Отступы – указывает настройки отступов по отношению к другим блокам в данном микрошаблоне.

Свойства микрошаблона

ID – генерируется автоматически (его можно изменить) и используется при написании программной логики (скриптов).

Классы CSS – классы таблиц стилей CSS, которые можно создавать в «Редакторе стилей».

Полная ширина – растягивает микрошаблон на всю ширину экрана.

Плагины

Плагины представляют собой блоки с заранее определенной функциональностью, которым можно задать необходимую стилистку.

Чтобы добавить плагин необходимо нажать на кнопку «Добавить плагин» в правом нижнем углу экрана. В левой части экрана появится список плагинов, после чего нужно выбрать необходимый плагин и перетащить его в макет. При перетаскивании в макете отобразятся специальные метки, указывающие на места, где можно создать плагин.

Справа от уже существующих блоков указаны места, где можно добавить блок. Внизу, под плагинами можно добавлять плагины в уже существующие блоки. Под микрошаблонами появятся места для создания новых микрошаблонов.

Ниже описаны основные плагины и их возможности.

HTML

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

Статическое меню

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

Слайдер / Карусель

Слайдер или карусель (в зависимости от настроек), основанный на изображениях галереи, которую нужно заранее создать в разделе «Галереи» и добавить в нее изображения.

Галерея изображений

Изображения из галереи, которую нужно создать в разделе «Галереи» и добавить в нее изображения.

Видео YouTube

Видео, которое подтягивается по ссылке на видео на сайте YouTube.

Языки

Ссылки на другие языковые версии страницы, которые формируются автоматически.

Логотип

Логотип со ссылкой на главную страницу сайта.

Меню

Меню сайта, которое формируется автоматически на основе разделов меню в модуле «Меню и публикации».

Публикации

Перечень публикаций из модуля «Меню и публикации», которые выводятся в зависимости от настроек плагина.

Форма

Форма для заполнения которую нужно заранее создать в модуле «Формы».

Категории товаров

Перечень категорий товаров которые формируются автоматически, на основе категорий товаров в модуле «Каталог товаров».

Товары

Перечень товаров из модуля «Каталог товаров», которые выводятся в зависимости от настроек плагина.

Варианты товаров

Перечень вариантов товаров из модуля «Каталог товаров», которые выводятся в зависимости от настроек плагина.

Валюты

Ссылки на валюты из модуля «Каталог товаров», которые формируются автоматически.

Производители

Ссылки на производителей и модуля «Каталог товаров», которые формируются автоматически и зависят от настроек плагина.

Поиск

Форма поиска по сайту, обычно располагается в шапке сайта, но не обязательно там.

Плагин соцсети

Плагин социальной сети или любой другой плагин JavaScript, который необходимо заранее создать в модуле «Социальные сети».

Ссылки на соцсети

Ссылки на социальные сети, заранее созданные в модуле «Социальные сети».