Почему не отображаются шрифты?

Проблема с отображением может возникнуть, если при редактировании блока вручную назначили другой шрифт.
Поэтому в блоке сбрасываются настройки и устанавливается шрифт по умолчанию.
Подробнее о проблеме
Например, изначально в настройках сайта (раздел «Шрифты и цвета») вы установили шрифт Roboto. Затем в блоке выделили текст и в появившемся контекстном меню вручную указали этот шрифт.
После этого в настройках сайта поменяли шрифт на Open Sans. В блоках, где шрифт не был указан вручную, текст стал отображаться новым шрифтом. Но в блоках, в которых он был задан вручную, возникает проблема. Это произошло из-за того, что предыдущий шрифт больше не подключен к сайту.
Важно: настройки, заданные вручную в контекстном меню, могут конфликтовать с другими настройками типографики
Как исправить проблему
Необходимо перейти к блоку → нажать на любое место в тексте → шрифт автоматически изменится на добавленный.
Сбросить настройки шрифта можно и вручную, для этого выберите пункт «Очистить шрифт» в выпадающем меню или нажмите «Очистить стили» на панели редактирования.
Проблемы и способы решения в зависимости от метода подключения шрифта
Шрифт подключен с помощью файла CSS, но не отображается
Подробнее
Возможные проблемы при подключении своего шрифта через загрузку файлов
Подробнее
Возможные проблемы со стандартными шрифтами
Подробнее
При открытии сайта сначала загружается системный шрифт
Подробнее
Шрифт подключен с помощью CSS-файла
Убедитесь, что вы указали корректное название шрифта в настройках сайта.

Название шрифта (font-family) должно совпадать с данными из CSS-файла: настройки сайта → раздел «Шрифты и цвета» → вкладка «Загрузить шрифт».
Важно: при подключении шрифта через CSS-файл нужно удостовериться, что сервер, с которого подключается шрифт, поддерживает Access-Control-Allow-Origin CORS для раздачи для любого домена. (Access-Control-Allow-Origin: *). Как установить эту настройку на сервере, указано в инструкции для подключения своего файла CSS
Шрифт подключен с помощью Google Fonts
При добавлении шрифта важно, чтобы название шрифта в настройках сайта совпадало с названием шрифта в Google Fonts.
Помимо этого обязательно проверьте ссылку на CSS-файл Google Fonts, она должна выглядеть так:
https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&display=swap
Шрифт загружен файлами
Убедитесь, что под загруженными woff-файлами вы указали полное официальное название шрифта. Это же название должно быть указано для Заголовков и/или Текста в Настройках сайта → Шрифты и цвета.
Если шрифт корректно отображается на латинице, но на кириллице возникают проблемы, то стоит проверить, поддерживает ли шрифт кириллические символы. Эту информацию можно получить на стороне сервиса, в котором вы приобрели шрифт.

Также при конвертации некоторые сервисы могут портить кириллическую версию. Это можно проверить в сервисе FontDrop!. Для конвертирования рекомендуем воспользоваться WOFFer.
Шрифт добавлен из библиотеки шрифтов
Проблема с базовыми шрифтами может наблюдаться на экспортированных проектах.

На Тильде часть шрифтов берется из библиотеки сервисов Paratype и type.today, которые предоставляют шрифты по партнерскому соглашению.

На данный момент шрифты Paratype:
  • Circe (и Circe Rounded)
  • Mediator (и Mediator Serif)
  • Reforma Grotesk

Шрифты type.today:
  • Graphik
  • Kazimir

Чтобы они и другие встроенные шрифты работали на экспортированном сайте, нужно обязательно указать домен, на который вы экспортируете проект в настройках сайта → «Домен». Достаточно указать название домена, подключать его не требуется.
Шрифт долго загружается
Чтобы файл шрифта загрузился, требуется время. На скорость загрузки влияет качество используемого интернет-подключения и количество контента на странице сайта. 

Чтобы страница не тормозила и посетитель не ждал, сначала загружается самое важное — контент, а потом вспомогательные компоненты. Поэтому вы можете видеть системные шрифты до того, как загрузился ваш шрифт.

Воспользуйтесь блоком «Эффект загрузки страницы» (Т228, категория «Другое»). Он замедлит появление контента и текст будет отображаться с загруженными шрифтами.
Если при открытии сайта в браузере вы наблюдаете «мерцание» — сначала загружается системный шрифт, потом ваш собственный — это не ошибка, а нормальное поведение.

Назначаем проекту шрифты или подключаем собственные, используя Google Fonts, Adobe Fonts или внешний CSS файл

Загрузка собственных файлов шрифта в форматах WOFF и WOFF2

Как подключить шрифты Adobe Fonts в Тильда Паблишинг

Как подключить шрифты Google Fonts в Тильда Паблишинг

Гайд по возможным ошибкам отображения шрифтов на сайте

Made on
Tilda