Шаблоны

Общие сведения

Шаблоны в системе Flexy CMS состоят из:

  • страницы PHP-контроллера controller.php
  • таблицы стилей styles.scss
  • страницы скриптов scripts.js
  • шаблона в формате TWIG

Контроллер, шаблон, стили и скрипты хранятся на сервере в виде файлов, поэтому возможно как изменение их из административного раздела, так и прямое ручное редактирование файлов (не их переименование или ручное создание на диске). Но при необходимости вы можете создать любые дополнительные файлы в каталоге шаблона и обращаться к ним из четырёх основных. Это могут быть дополнительные таблицы стилей, каталоги с изображениями, дополнительные скрипты и т.п.

Каталог для хранения шаблонов находится по адресу:

/sites/[каталог сайта]/templates/[каталог шаблона]/

Название каталога шаблона состоит из идентификатора шаблона и, если есть, отделённого дефисом постфикса (указывается при создании шаблона и может быть изменён через административный раздел).

Внимание! Не переименовывайте каталог шаблона и не создавайте шаблон вручную на диске - это приведёт к расхождению с информацией о шаблоне, хранящейся в базе данных!

Стили шаблона выполнены в формате SCSS и будут скомпилированы автоматически в CSS.

При необходимости определить общие для всех шаблонов стили, вы можете воспользоваться файлов default.scss, находящемся по адресу /sites/templates/default.scss - он будет подключен при компиляции к любому SCSS файлу.

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

Использование шаблона в разделах сайта

Использовать шаблон с кодом $templateKey в разделе вы можете двумя способами:

$this->wrap($var, $templateKey, $parameters)

print $this->getTemplate($templateKey, $parameters)->html

Оба метода передают в шаблон ассоциативный массив $parameters. Параметры будут доступны в контроллере шаблона в виде переменных с названием, соответствующем ключу массива. Например, если в шаблон передан массив array("a" => 1, "b" => 2), в контроллере шаблона будут доступны 2 переменные $a и $b со значениями 1 и 2.

Метод wrap в дополнение к параметрам создаёт в шаблоне переменную с именем $var и значением результирующего HTML-кода раздела.

Метод getTemplate просто возвращает в раздел результат работы шаблона.

Работа со скриптами и стилями

Подключить файл стиля в шаблоне вы можете методом

$this->registerStyles($filePath, $moveToFirst, $preprocessors)

$filePath - путь к файлу стиля. Допускается использование заменителей /sites/1-flexycms/themes/default/1-index/ и /sites/1-flexycms/ - пути к шаблону и сайту соответственно.
$moveToFirst - флажок, определяющий, нужно ли зарегистрировать этот стиль первым. По умолчанию - false
$preprocessors - массив обработчиков стиля. Во Flexy CMS определены 2 обработчика Packer::compileSCSS и Packer::minimizeCSS. Первый компилирует SCSS в CSS, сохраняя новый файл стиля file.scss в ту же директорию с именем _file.css. Второй сжимает таблицу стилей, создавая файл __file.css. Если обработчики не указаны, будет зарегистрирован исходный стиль.

Скрипты Javascripts подключаются аналогично методом

$this->registerScripts($filePath, $moveToFirst, $preprocessors)

Если вы работаете напрямую из контроллера, вставить скрипты и стили в результирующий HTML можно методами $this->insertScripts() и $this->insertStyles()

Если вы используете шаблонизатор TWIG, скрипты и стили будут доступны в переменных styles и scripts

Вывод шаблона

Если вам привычнее работать только с PHP, вы можете выводить результат работы шаблона функциями print или echo прямо из контроллера. Но мы рекомендуем разделять сбор данных и вёрстку и использовать шаблонизатор TWIG - для этого в шаблоне используется команда print $this->render($parameters);

Здесь $parameters - ассоциативный массив параметров, которые вы хотите передать в TWIG. Учтите, они заполняются только в контроллере шаблона и никак не связаны с тем, что вы передали из раздела. Зарегистрированные в шаблоне скрипты и стили добавятся в массив автоматически с ключами "styles" и "scripts"

Пример

Код шаблона:

$parameters = array("header" => "Заголовок", "list" => array("первый","второй","третий"));

print $this->render($parameters);

Код TWIG:

{{ header }}

    {% for item in list %}
  1. {{ item }}
  2. {% endfor %}

Будет выведена страница с заголовком "Заголовок" и нумерованным списком из трёх строк.

Подробнее об использовании TWIG вы можете прочитать на официальном сайте https://twig.symfony.com/