Задать вопрос
@Artem_NoName

Как правильно подключить шрифты в 1C-Битрикс и почему у меня не получается?

Добрый день! Я совсем недавно начал развиваться в сфере разработки сайтов и ещё позднее начал работать с Битрикс.

Пытаюсь добавить пользовательские стили (в GoogleFonts такого стиля нет в целом) через загрузку файлов на сервер.

Вот мой код:

font-ntsomic.css (путь: /local/templates/мой-шаблон/font-ntsomic.css)

@font-face {
	font-family: 'NTSomic';
	font-style: normal;
	font-weight: 300;
	src:
		url('/local/templates/мой-шаблон/fonts/NTSomic-Regular.otf') format ('opentype'),
		url('/local/templates/мой-шаблон/fonts/NTSomic-Regular.ttf') format ('truetype'),
		url('/local/templates/мой-шаблон/fonts/NTSomic-Regular.woff') format ('woff');
}
@font-face {
	font-family: 'NTSomic';
	font-style: normal;
	font-weight: 400;
	src:
		url('/local/templates/мой-шаблон/fonts/NTSomic-Medium.otf') format ('opentype'),
		url('/local/templates/мой-шаблон/fonts/NTSomic-Medium.ttf') format ('truetype'),
		url('/local/templates/мой-шаблон/fonts/NTSomic-Medium.woff') format ('woff');
}
@font-face {
	font-family: 'NTSomic';
	font-style: normal;
	font-weight: 700;
	src:
		url('/local/templates/мой-шаблон/fonts/NTSomic-Bold.otf') format ('opentype'),
		url('/local/templates/мой-шаблон/fonts/NTSomic-Bold.ttf') format ('truetype'),
		url('/local/templates/мой-шаблон/fonts/NTSomic-Bold.woff') format ('woff');
}


Все шрифты находятся в папке fonts (путь: /local/templates/мой-шаблон/fonts/)

Само подключение (путь:/local/templates/мой-шаблон/мой-файл.css):
body
{
	font-family: NTSomic, sans-serif;
}


Нужна помощь, не могу понять, где я ошибся
  • Вопрос задан
  • 133 просмотра
Подписаться 1 Простой 11 комментариев
Пригласить эксперта
Ответы на вопрос 1
cyber-jet
@cyber-jet
Вы можете использовать относительный формат пути, относительно расположения css файла.
@font-face {
  font-family: "PT Sans";
  src: url("../fonts/PTSans-Regular.ttf");
}

body
{
  font-family: 'PT Sans', sans-serif;
}

Если используете сборщик, он может "поправить" путь на своё усмотрение в определенных случаях.
Лучше всего @font-face объявлять в самом верху, перед остальными стилями.
Пример рабочий, проверенный, из моего проекта.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы