Как создать свой шаблон для Эгеи

Создать свой шаблон для Эгеи не так сложно как может показаться на первый взгляд. Давайте разберем основные принципы построения шаблона используя некоторые простые примеры.

Пользовательские темы находятся в папке ../themes в корне блога. Создадим в этом каталоге папку и назовем её так, как хотим чтобы называлась наша будущая тема. Например «сherry» — ../themes/сherry. Информация о теме хранится в файле theme-info.php её корневой папки и содержит следующий код:

<?php return array (

/* Порядок темы в списке тем в админке */
'index' => 99,

/* Отображаемое название темы для разных языков */
  'display_name' => array (
  'en' => 'Cherry',
  'ru' => 'Вишня',
  'uk' => 'Вишня',
  ),

/* Параметры основных цветов */
  'colors' => array (
    'background' => '#faebd2',
    'headings' => '#000',
    'text' => '#000',
    'link' => '#3d6077',
  ),

/* На какой теме основана текущая тема */
  'based_on' => 'plain',

/* Параметры метатега viewport */
  'meta_viewport' => 'width=device-width, initial-scale=1',

  /* Поддержка тёмного режима */
  'supports_dark_mode' => false,

); ?>

В папке темы также существует несколько папок из которых Эгея подхватывает скрипты, стили, изображения и файлы разметки:

../themes/сherry/images — Изображения
../themes/сherry/js — JS скрипты
../themes/сherry/src — Исходные sass/less файлы стилей
../themes/сherry/styles — CSS стили
../themes/сherry/templates — PHP файлы шаблона

Если файлов в папках нет, они будут подхватываться из стандартной темы Эгеи, которая находится по пути ../system/theme, либо из темы указанной как базовая в конфигурационном файле theme-info.php.

Чтобы внести изменения в стандартные шаблоны Эгеи, скопируйте необходимый файл из ../system/theme/templates в папку templates вашей темы и уже там производите все изменения. Вносить правки в системной папке не стоит, так как после обновления движка все изменения исчезнут.

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

user-picture.tmpl.php — Аватар блога.
author-menu.tmpl.php — Меню автора.
search-heading.tmpl.php — Форма поиска.
notes.tmpl.php — Пост.
pages.tmpl.php — Навигация между постами.
comments-heading.tmpl.php — Заголовок списка комментариев с счетчиком их количества.
comments.tmpl.php — Список комментариев.
form-comment.tmpl.php — Форма комментария.
form-comment-reply.tmpl.php — Форма ответа на комментарий.
popular.tmpl.php — Блок популярных постов.
pages-earlier.tmpl.php — Кнопка к постам «Ранее».
pages-later.tmpl.php — Кнопка к постам «Позднее».
notes-list.tmpl.php — Список всех постов блога.
heading.tmpl.php — Заголовки на большинстве страниц.
form-note.tmpl.php — Форма публикации поста.
form-note-delete.tmpl.php — Форма удаления поста.
form-note-publish.tmpl.php — Кнопка публикации поста.
drafts.tmpl.php — Список черновиков.
form-preferences.tmpl.php — Форма общих настроек блога.
form-password.tmpl.php — Форма смены админ-пароля.
form-database.tmpl.php — Форма подключения к базе данных.
sessions.tmpl.php — Список текущих сессий.
form-install.tmpl.php — Форма установки Эгеи.
form-login.tmpl.php — Форма авторизации.
tags.tmpl.php — Список всех тегов блога.
form-tag.tmpl.php — Форма редактирования тега.
form-tag-delete.tmpl.php — Форма удаления тега.
tags-menu.tmpl.php — Меню избранных тегов.
form-search.tmpl.php — Форма поиска на странице поиска.
login-element.tmpl.php — Кнопка авторизации в футере.
form-password-reset-email.tmpl.php — Страница сброса пароля.
layout.tmpl.php — Основная разметка шаблона внутри body, здесь подключаются другие части шаблона.
main.tmpl.php — Разметка внутри html, здесь подключается head.tmpl.php содержащий метатеги, сам layout.tmpl.php, js и css.

Эти файлы можно копировать в папку templates своей темы и редактировать на свой вкус.

Подключить свою собственную часть шаблона можно создав файл типа name.tmpl.php в папке templates и затем вызвать его в любом другом месте или в layout.tmpl.php. Например, можно создать файл menu.tmpl.php со своим меню и ссылками на соц-сети, сверстанными на html и css, и вызвать его в layout.tmpl.php специальным макросом. Илья Бирман в справке к Эгее пишет:

Шаблон может вызывать другие шаблоны для отображения конкретного фрагмента: _T () — вызывает шаблон по имени. (...) Шаблон layout.tmpl.php «срабатывает» потому, что main.tmpl.php вызывает его для формирования тела страницы.

Так, чтобы вывести содержимое файла menu.tmpl.php где нибудь на сайте, достаточно небольшого кода:

<?php _T ('menu') ?>

К слову, если вам нужно вывести часть шаблона, скажем, только на главной странице, но не на странице поста, оберните код вывода следующим уточнением:

<?php if ($content['class'] == 'frontpage') { ?>
  <?php _T ('menu') ?>
<?php } ?>

Или, если нужно вывести эту часть шаблона только на странице поста:

<?php if ($content['class'] == 'note') { ?>
   <?php _T ('menu') ?>
<?php } ?>

JS и CSS в тему Эгеи тоже подключаются специальными макросами. Для наглядности откройте стандартный main.tmpl.php и посмотрите в конец файла, после закрывающего тега body:

<?php _CSS ('main') ?>
<?php _JS ('main') ?>

Здесь подхватываются ../js/main.js и ../styles/main.css из папки темы, или из стандартной темы, если нет соответствующих файлов. По такому принципу можно добавить, например, скрипт bootstrap.min.js в папку js и подключить его кодом:

<?php _JS ('bootstrap.min') ?>

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