С помощью макросов вы можете заменять названия классов, используемые во всех шаблонах. Это позволит оставить существующие файлы шаблонов при натягивании нового стиля - структура шаблонов чаще всего совпадает, различаются только названия классов.
Суть макросов
Большая часть готовых шаблонов панели управления на базе Bootstrap использует одинаковую структуру. В них есть сетка, кнопки, формы, блоки контента и таблицы. Набор HTML-элементов практически не отличается от шаблона у шаблону. Но различаются названия классов.
Например, шаблон AdminLTE в качестве "стандартного" блока вёрстки страницы использует класс box
. В классическом Bootstrap 3 для этих же целей примеряется класс panel
. Основной контент блока имеет класс box-body
и panel-body
соответственно. Получается, чтобы заменить один шаблон на другой, нам нужно просто поменять во всех названиях классов box
на panel
. Или на card
, если у нас более свежая версия Bootstrap.
Именно в этом состоит задача макросов. Большая часть названий классов в шаблонах AlterCPA указана именно макросами. Вы можете поменять название класса в настройках, после чего он автоматически вставится во все шаблоны, которых давно больше сотни. И вам не нужно будет менять их вручную. При обновлении системы, а значит и шаблонов, всё так же пройдёт автоматически.
Настройка макросов
Управление макросами выполняется из раздела "Макросы". В столбце "Название" раскрыта задача макроса. В столбце "Код" указано название, которое можно использовать для вставки в шаблон и другие макросы.
Значение макроса - это то содержимое, которое в итоге будет вставлено в шаблон. Внутри значения может присутствовать как конкретный набор символов, так и значение другого макроса. Чтобы вставить значение макроса xxx
в другой макрос, используйте код {xxx}
.
Вы также можете вставлять значение из раздела "Параметры". Для вставки параметра с названием xxx
будет использоваться код {cfg:xxx}
.
Дополнительные параметры из основной конфигурации внешнего вида:
{mcfg:box}
- основной цвет кнопок и элементов: success, warning, danger, primary, info, default{mcfg:bg}
- цвет окраски виджетов: light-blue, aqua, navy, teal, green, purple, yellow, orange, red, maroon, gray, black
Например, у нас есть макрос box
для основного блока, который может содержать в себе блоки box-header
, box-body
и box-footer
. Записываем эти макросы как {box}-header
, {box}-body
и {box}-footer
соответственно. Теперь, если мы поменяем значение макроса box
на panel
, наши зависимые макросы преобразуются в panel-header
, panel-body
и panel-footer
.
Вставка макросов в шаблон
Для вставки значения макроса с названием xxx
в шаблон, используйте следующий код:
{tpl:xxx}
Вы также можете вставлять значение параметра стиля. Для вставки параметра с называнием xxx
в шаблон, используйте код:
{tpl:cfg-xxx}
Полезные макросы
При работе с шаблонами, вам будет удобно указывать пути к ресурсам с помощью макросов. Так эти пути будут актуальными при переносе стиля в другую папку.
{tpl:skin}
- папка стиля, напримерmystyle
.{tpl:skinpath}
- путь к стилю, например/skin/mystyle
, без слеша в конце.{tpl:skincss}
- путь к CSS-файлам, например/skin/mystyle/css
, без слеша в конце.{tpl:skinjs}
- путь к JS-файлам, например/skin/mystyle/js
, без слеша в конце.{tpl:skinimg}
- путь к картинкам, например/skin/mystyle/img
, без слеша в конце.
Рекомендуемая настройка для Bootstrap-3
Перед тем, как натянуть шаблон на базе Bootstrap-3, рекомендуется настроить макросы для максимального соответствия классическому Bootstrap:
bg
-bg-{mcfg:box}
bg-active
-{bg}-active active-bg
box
-panel
box-widget
-{box-primary} widget
box-header
-{box}-heading
alert
-alert