Шаблон

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

Создание своего шаблона

1. Откройте папку system\themes\plain.

2. Скопируйте эту папку в user\themes. Если папка themes отсутствует в user, создайте ее.

3. Переименуйте скопированную папку на свое усмотрение, например, в custom.

4. Откройте файл theme-info.php в папке custom любым редактором кода.

5. В файле theme-info.php найдите строку index и укажите любой порядковый номер шаблона, например 99. В строке display_name укажите имя шаблона на русском и английском.

<?php return array (

  'index' => 99,

  'display_name' => array (
    'en' => 'Custom',
    'ru' => 'Кастом',
  ),

  'colors' => array (
    'background' => '#fff',
    'headings' => '#000',
    'text' => '#000',
    'link' => '#0060a0',
  ),

  'meta_viewport' => 'width=device-width, initial-scale=1',
  'supports_dark_mode' => true,

); ?>

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

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

Если файлов в папках нет, они будут подхватываться из стандартной темы Эгеи, которая находится по пути system\themes.

Стили

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

Файл overrides.css работает не только в пользовательских, но и в стандартных шаблонах. Дополнительно ничего подключать не нужно, Эгея подхватывает этот css файл автоматически.

Разбор основных шаблонов

Теперь стоит подробнее разобрать содержимое папки 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') ?>

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