Advanced Grid это модуль который отвечает за кастомизацию (настройку внешнего вида) и структурирования данных отображения системы опенкарт. То-есть это конструктор шаблонов который позволяет настроить отображения товаров, баннеров и информации на странице.
В меню панели администратора перейдем в раздел
Модули / Расширения -> Модули / Расширения находим модуль с названием Advanced Grid и нажимаем на кнопку редактировать.
Попадаем на страницу редактирования. См. картинку ниже.
Module находящиеся в левом углу являют собой некую сетку шаблона, у них есть свои порядковые номера но это не означает что они отображаются в таком порядке как и порядковый номер модуля.
Порядок отображения указывается свойством Sort order: которое можно найти нажав на Module1 -> Module Setting.
Важно (порядок нумерации начинается с 0) то-есть 0 = 1.
Если представить это в графическом виде то выглядеть это будет примерно так.
Для того что бы настроить отображение модуля нужно перейти в Module1 -> Module Setting.
Пройдемся по свойствам.
Add Custom class – добавление css свойств.
Margin – внешние отступы блока.
Padding – отступы внутри блока.
Background color – цвет заднего фона.
Background image type – картинка заднего фона. Если в качестве заднего фона используется картинка.
Position – позиционирование картинки(верх, верх-слева, верх-справа| низ, низ-слева, низ-справа| по центру (50%).
Repeat – повторения (по оси x,y).
Attachment – фиксированная или с прокруткой.
Layout setting – настройка макета отображения.
Layout – выбираем на какой странице отображать.
Position – выбираем к какой секции сайта прикрепить отображение блока.
Status – статус отображения блока (Enabled –включен, Disabled – выключен.
Sotr Order - порядковый номер отображения в конкретной секции(начинается с 0,то-есть 0=1).
Disable on Mobile – включить отображение на мобильных устройствах.
Добавление-редактирование колонок в модуле
Пример: нужно добавить 2-ве колонки что бы модуль на сайте приобрел некий вид. См. ниже.
Для добавления колонки нужно нажать на Add Column и настроить свойства.
Свойства:
Column width: можно указать от 1/12 до 12/12 где каждая часть это некий размер колонки.
Пример:
То-есть если нам надо отображать к примеру в одном блоке Module 1 несколько блоков (например 2)будь то продукты или иной вид контента и они могут иметь разные размеры. То нам нужно посчитать, 1-я колонка размером (3/12) и 2-я колонка размером (9/12).Считаем 3/12 + 9/12 = 12/12 то-есть мы попадаем в диапазон 12/12 . Получиться module 1 будет отображаться так.
Внутри Module сетка(Column) может разветвляться вертикально неограниченное кол-во раз при учете того что колонки будут созданы сеткой 12/12.
Если создать 3 column размерами сетки 3/12, 9/12 и 12/12 то они будут отображаться таким образом.
То-есть после превышения размера сетки 12/12 следующая колонка
перейдет на новую строку.
Disabled of Mobile: включить или отключить отображения на мобильных устройствах.
Также у каждой из колонок можно добавить модуль колонки нажав на кнопку Add Module To The Column.
Add Module To The Column: свойства разветвления для данного модуля колонок только вертикальный.
Например:
Если создать Module1:
Colum: 3/12
Colum: 9/12
Colum module 1
Colum module 2
Будет иметь следующий вид.
Где Sort в обоих случаях означает сортировку, то-есть позицию отображения(начинаем с 1).
Type Column – тип колонки. В зависимости от выбранного типа колонки будут иметь различные настройки и отображение.