Свой шрифт в Эгее
Чтобы добавить шрифт в Эгею, есть два способа — это добавление его в стандартный шаблон или создание своего собственного. Создание своего шаблона удобнее, поскольку гарантирует, что изменения не будут потеряны при обновлении или переустановке Эгеи. Но это не точно.
Если не хочется заморачиваться с созданием своего шаблона, можно сразу перейти к подключению шрифта в один из стандартных или в свой собственный шаблон, если он был создан ранее. Для создания своего шаблона в версии 11.2 Эгеи:
- Откройте папку
system\themes\plain
. - Скопируйте эту папку в
user\themes
. Если папкаthemes
отсутствует вuser
, создайте ее. Если Эгея младше версии 11.2, папкаthemes
находится в корневой папке сайта. - Переименуйте скопированную папку на свое усмотрение, например, в
custom
. - Откройте файл
theme-info.php
в папкеcustom
любым редактором кода. - В файле
theme-info.php
найдите строкуindex
и укажите порядковый номер шаблона, который используется в списке шаблонов Эгеи. В строке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,
); ?>
Теперь можно подключить шрифт, например, Tilda Sans VF.
- Создайте папку
fonts
в папке шаблона. - В папке
fonts
создайте папкуtildasans
. - Скопируйте файлы шрифта
TildaSans-VF.ttf
,TildaSans-VF.woff
иTildaSans-VF.woff2
в папкуtildasans
. - Создайте файл
overrides.css
в папкеstyles
вашего шаблона. - Отредактируйте файл
overrides.css
:
/* Подключаем шрифты. */
@font-face {
font-family: 'TildaSans';
src: url('../fonts/tildasans/TildaSans-VF.ttf') format('truetype');
src: url('../fonts/tildasans/TildaSans-VF.woff') format('woff2'),
url('../fonts/tildasans/TildaSans-VF.woff2') format('woff');
font-weight: normal;
font-style: normal;
}
:root {
/* Глобальный шрифт сайта. */
--mainFontFamily: 'TildaSans', system-ui, -apple-system, BlinkMacSystemFont, "SF UI Text", "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
/* Шрифт статей. */
--noteMainFontFamily: inherit;
/* Шрифт подписей у изображений, тегов и прочих мелких элементов. */
--smallFontFamily: inherit;
}
Здесь мы подключаем шрифт и переопределяем глобальные параметры в root. По аналогии можно подключить любой другой шрифт.
Помните, что в overrides.css
можно добавлять любые ваши стили. Эгея подхватит этот файл из папки styles
автоматически, в любом шаблоне — пользовательском или стандартном.
Если кастомный шрифт так и не работает, скопируйте файл .htaccess
из папки styles
шаблона и положите его в папку fonts
.
Дополнительно можно отредактировать размеры шрифтов.
:root {
/* Заголовок в шапке сайта. */
--blogTitleFontSize: 20px;
--blogTitleLineHeight: 26px;
/* Заголовки перебивок. */
--subHeadingFontSize: 26px;
--subHeadingLineHeight: 30px;
/* Заголовки страниц. */
/* Например, заголовок */
/* на странице тега. */
--pageHeadingFontSize: 36px;
--pageHeadingLineHeight: 40px;
/* Заголовки статей. */
--noteTitleFontSize: 36px;
--noteTitleLineHeight: 42px;
/* Текст класса .lead */
--noteLeadFontSize: 26px;
--noteLeadLineHeight: 30px;
/* Текст статей. */
--noteTextFontSize: 20px;
--noteTextLineHeight: 28px;
/* Подписи изображений, теги */
/* и прочие мелкие элементы. */
--smallFontSize: 12px;
--smallLineHeight: 16px;
/* Текст кнопок. */
--bigButtonFontSize: 20px;
--bigButtonLineHeight: 28px;
}
Пример шаблона с реализацией описанного в посте гайда, актуален для версии Эгеи 11.2 4116.