Шрифты
Шрифты
С выпуском Publii версии 0.39.0 в наших темах произошли существенные изменения в способе загрузки шрифтов. Ранее шрифт Google загружался непосредственно из своего CDN. Однако, поскольку большинство браузеров заблокировали передачу данных кэширования ресурсов между доменами, пользователи должны повторно загружать файлы шрифтов для каждого посещаемого ими сайта, использующего один и тот же шрифт, независимо от того, был ли он загружен и кэширован ранее с другого сайта. Что еще более важно, суд ЕС постановил, что шрифты Google (загруженные непосредственно из его CDN) не соответствуют GDPR, который требует получения согласия перед сбором и хранением какой-либо личной информации, позволяющей установить личность.
В связи с этими изменениями все шрифты, предоставляемые Publii, отныне будут загружаться локально (на самостоятельном хостинге), что дает несколько преимуществ нашему предыдущему решению:
- Позволяет избежать дополнительного поиска в DNS
- Удаляет неминифицированный CSS
- Обеспечивает лучший контроль над настройками кэша
- Соответствует GDPR
Переменные шрифты
Чтобы уменьшить количество файлов шрифтов и обеспечить больший контроль над ними, наши темы поставляются только с изменяемыми шрифтами. При использовании переменных шрифтов вместо загрузки обычной и выделенной жирным шрифтом версии шрифта, Publii будет загружать только один файл. Это важно, потому что Publii позволяет загружать два разных шрифта; если бы на сайте были включены как стандартные, так и выделенные жирным шрифтом версии каждого из этих шрифтов, общий вес (то есть размер загружаемых файлов) файлов был бы слишком большим и мог негативно повлиять на время загрузки.
Еще одно преимущество использования переменных шрифтов заключается в том, что теперь мы можем манипулировать их размером во всем диапазоне; вместо того, чтобы выбирать только между отображением шрифта 400 (обычный) или 700 (жирный), мы можем выбрать отображение данного шрифта с кажущимся случайным размером, таким как 436, что дает нам еще больший контроль при настройке стиля нашего сайта.
Довольно здорово, не правда ли?
Еще одна вещь, на которую следует обратить внимание; возможно, вы заметили, что мы опустили некоторые модные шрифты, такие как “Open Sans” или “Noto Sans”, из шрифтов, включенных в Publii. Мы решили не включать эти шрифты, поскольку их вес (размер) слишком велик, что неприемлемо при создании легкого статического веб-сайта, для которого предназначена CMS Publii.
Список доступных шрифтов с их описанием
Ниже приведен список всех шрифтов, используемых в наших темах, включая их начертание, вес или размер.
Name | Preview | Weight range | Size |
---|---|---|---|
Serif | |||
Aleo | ![]() | 100 - 900 | 66 kb |
Andada Pro | ![]() | 400 - 840 | 106 kb |
Besley | ![]() | 400 - 900 | 49 kb |
Bitter | ![]() | 100 - 900 | 108 kb |
Brygada 1918 | ![]() | 400 - 700 | 89 kb |
Domine | ![]() | 400 - 700 | 40 kb |
Faustina | ![]() | 300 - 800 | 49 kb |
Frank Ruhl Libre | ![]() | 300 - 900 | 78 kb |
Imbue | ![]() | 100 - 900 | 90 kb |
Kreon | ![]() | 300 - 700 | 33 kb |
Labrada | ![]() | 100 - 900 | 86 kb |
Lora | ![]() | 400 - 700 | 83 kb |
Manuale | ![]() | 300 - 800 | 76 kb |
Petrona | ![]() | 100 - 900 | 86 kb |
Playfair Display | ![]() | 400 - 900 | 106 kb |
Roboto Slab | ![]() | 100 - 900 | 117 kb |
Rokkitt | ![]() | 100 - 900 | 53 kb |
Yrsa | ![]() | 300 - 700 | 90 kb |
Sans Serif | |||
Advent Pro | ![]() | 100 - 900 | 66 kb |
Antonio | ![]() | 100 - 700 | 37 kb |
Archivo Narrow | ![]() | 400 - 700 | 37 kb |
Asap | ![]() | 400 - 700 | 57 kb |
Assistant | ![]() | 200 - 800 | 37 kb |
Cabin | ![]() | 400 - 700 | 45 kb |
Cairo | ![]() | 200 - 900 | 74 kb |
Dosis | ![]() | 200 - 800 | 47 kb |
Exo | ![]() | 100 - 900 | 54 kb |
Figtree | ![]() | 300 - 900 | 29 kb |
Glory | ![]() | 100 - 800 | 42 kb |
Heebo | ![]() | 100 - 900 | 41 kb |
Instrument Sans | ![]() | 400 - 700 | 49 kb |
Jura | ![]() | 300 - 700 | 78 kb |
Karla | ![]() | 200 - 800 | 42 kb |
Lexend | ![]() | 100 - 900 | 74 kb |
Libre Franklin | ![]() | 100 - 900 | 44 kb |
Manrope | ![]() | 100 - 900 | 53 kb |
Maven Pro | ![]() | 400 - 900 | 42 kb |
Merriweather Sans | ![]() | 300 - 800 | 93 kb |
Montserrat | ![]() | 100 - 900 | 125 kb |
Nunito | ![]() | 200 - 900 | 100 kb |
Orbitron | ![]() | 400 - 900 | 16 kb |
Oswald | ![]() | 200 - 700 | 66 kb |
Plus Jakarta Sans | ![]() | 200 - 800 | 61 kb |
Public Sans | ![]() | 100 - 900 | 40 kb |
Quicksand | ![]() | 300 - 700 | 52 kb |
Raleway | ![]() | 100 - 900 | 128 kb |
Red Hat Display | ![]() | 300 - 900 | 41 kb |
Roboto Flex | ![]() | 100 - 900 | 78 kb |
Rubik | ![]() | 300 - 900 | 77 kb |
Ruda | ![]() | 400 - 900 | 38 kb |
![]() | 100 - 900 | 41 kb | |
Spartan | ![]() | 100 - 900 | 44 kb |
Urbanist | ![]() | 100 - 900 | 38 kb |
Work Sans | ![]() | 100 - 900 | 131 kb |
Yanone Kaffeesatz | ![]() | 200 - 700 | 53 kb |
Cursive | |||
Big Shoulders Display | ![]() | 100 - 900 | 82 kb |
Comfortaa | ![]() | 300 - 700 | 80 kb |
Dancing Script | ![]() | 400 - 700 | 59 kb |
Gluten | ![]() | 100 - 900 | 79 kb |
Lemonada | ![]() | 300 - 700 | 81 kb |
Monospace | |||
JetBrains Mono | ![]() | 100 - 800 | 71 kb |
Red Hat Mono | ![]() | 300 - 700 | 29 kb |
Source Code Pro | ![]() | 200 - 900 | 85 kb |
Как добавить пользовательский шрифт
Поскольку официальные темы Publii лучше всего работают с изменяемыми шрифтами, убедитесь, что у вас есть один в формате woff2. Не стоит поддерживать другие форматы, поскольку все современные браузеры поддерживают woff2, который обеспечивает наилучшее сжатие.
Чтобы добавить переменный шрифт в вашу тему, выполните следующие действия:
- Перейдите в эту папку:
/Documents/Publii/sites/Your_site/input/themes/Your_theme/
- Скопируйте ваш файл шрифтов,
your_font.woff2
, в папку/assets/dynamic/fonts/your_font/
- Откройте
config.json
файл и добавьте название вашего шрифта в двух разделах:fontBody
иfontHeadings
, затем сохраните изменения. - Затем откройте
theme-variables.js
файл и добавьте свой шрифт в разделе fontParams, указав семейство шрифтов и их вес, и сохраните изменения.
Важно: Мы рекомендуем создавать переопределения файлов, чтобы избежать потери внесенных изменений при обновлении темы, если только это не пользовательская тема. Вы можете узнать больше о переопределении тем Publii в этом руководстве.
Вот и все; теперь вы должны иметь возможность выбрать шрифт из опций темы и использовать его на своем сайте.