Как использовать кастомный шрифт на сайте
Как это работает
Если вам не подходят шрифты, доступные по умолчанию в конструкторе, вы можете подключить другой шрифт для заголовка или основного текста из каталога Google Fonts с помощью пользовательского HTML-кода. Вы можете использовать готовое решение или добавить свой код.
Как настроить
Использование готового решения
- Откройте проект в Личном кабинете.
- В боковом меню нажмите Site Builder.
- Нажмите Открыть Site Builder.
- Вставьте в блок Ваш код URL шрифта и укажите классы стилей, для которых необходимо изменить свойство
font-family
.
Пример изменения шрифта заголовка
Copy
- html
1<style>
2@import url('https://fonts.googleapis.com/css?family=Playfair+Display&display=swap');
3
4 .custom-header-font h1,
5 .custom-header-font h2,
6 .custom-header-font h3,
7 .custom-header-font h4,
8 .custom-header-font h5,
9 .custom-header-font h6 {
10 font-family: 'Playfair Display';
11 }
12</style>
Пример изменения шрифта основного текста
Copy
- html
1<style>
2 @import url('https://fonts.googleapis.com/css?family=Playfair+Display&display=swap');
3
4 .custom-main-font {
5 font-family: 'Playfair Display';
6 }
7</style>
- Нажмите кнопку Просмотр, чтобы увидеть изменения.
Ознакомьтесь с видеоинструкцией к разделу:
Добавление собственного кода
- В окне конструктора нажмите Добавить блок и выберите блок Ваш код.
- Вставьте в блок собственный код.
Была ли статья полезна?
Спасибо за обратную связь!
Ваши мысли и идеи помогут нам улучшить ваш пользовательский опыт.Полезные ссылки
Последнее обновление:
26 марта 2024
Нашли опечатку или ошибку в тексте? Выделите ее и нажмите Ctrl+Enter.