Создание сайта на 1С Битрикс — #17 — Работа с русскими шрифтами

Автор Denis Lisitsin
Создание сайта на 1С Битрикс — #17 — Работа с русскими шрифтами

Здравствуйте.

Меня зовут. Александр лырмин. Я разработчик сайтов на.

Битрикс вы смотрите 17 урок разработке сайтов на.

Битрикс с нуля для начинающих программистов верстальщиков дизайнеров проектор на прошлом уроке мы сделали расширенное меню с изображениями. Сегодня мы будем работать со шрифтами и узнаем как просто подключать шрифты на сайте и управлять ими HF так не будем знать следующая при необходимости на сайт можно подключить любой шрифт самый простой способ — это подключить шрифты из библиотеки Google если шрифт в ней отсутствует можно установить шрифт на сайт и подключить из папки. Итак поехали вот наш сайт который мы разрабатываем. Давайте посмотрим какой же шрифт здесь подключен. И, что с ним не так заметь можно следующее от слова Microsoft Windows по-английски написано она отличается от шрифта например семейства русского. Да ну или вот цифра 700 и есть буква. Р рубля. Это говорит о том, что русские шрифты. Именно для этого шрифта который используется. Вот они не работают английские работают нормально русские нет. Так, что будем делать с утра нужно узнать название шрифта инструктируемый элемент с правой стороны вот здесь есть такой раздел компьютер быстрее здесь найдём ищем Font Family What Font Family in Source Sans Pro отлично. Давайте посмотрим как этот шрифт подключен у нас заходим на сайт. Битрикс в наш текущий шаблон так вот шаблон и теперь надо узнать где он подключается разворачиваем так что-то что-то не то немного ещё раз inspect Element Font Family так стиль CSS 30 строка. Давайте заглянем стиль CSS 30 строка. Вот такая вот Source Sans Pro отлично так-так-так и вот он пожалуйста импорт у нас подключается шрифт Source Sans Pro посмотрим как он выглядит на. Гугле есть ли русская версия так camhunt так ключа Source Sans Pro. Вот сам шрифта есть всё в порядке включаем. Цирюльник русская версия нету соответственно. Нам необходимо подключить как папку со шрифтами используя файл стилей подключить тариф ты через стиль так как мы — это делаем. Давайте найдём сперва. Вот про церель download русская версия так. Тага хаба-хаба обычно здесь так вот так — это из. Гугла не подключают — это они переделывают шрифт конвертируют вот необходим форматы то есть вот формат wav он как раз используется на сайтах так отлично подключаем шрифт проекту. Вот — это важный момент мы его будем подключать запомним так-то кириллица курсив. Давайте посмотрим нужен ли нам курсив курсив нужен вот 300 и 600 и. Толик используют на, что делать на момент его получается. Нет давайте обойдемся вот этим вот курсивом потом если, что можно будет доработать архив готовых wav файлов можно скачать здесь. Кача отлично разархивировать так получили папочку вот у нас папка со шрифтами у нас уже в шаблоне. Есть папка fonts. Давайте туда. Вы грузим наши шрифты всё. Вот они появились после этого возвращаемся обратно по коду. Как дела. Вот — это вот всё волшебное дела так. Приходим сюда CSS открываем вот смотрите есть фон. Арсен мы его дублируем и сделаем фонд как у нас называется. Давайте назван вот так большие на маленькие заменяем открываем так здесь сильно все написано так предлагаю вот — это вот здесь указать, что информация взята отсюда до копера. Так теперь нам необходимо указать расположение шрифтов лучше всего сделать в кавычки так будет корректнее по формату CSS так сделали чтобы попасть в папку fonts нам нужно на одну из директории CSS выйти на Android.ru прописать если кто не знает всё прописали выше так посмотрим когда должны подключиться так не подключились. Да, а он использует наверное сейчас подключение старых шрифтов Stels антральная же ещё шрифт — это не подключился. Так теперь импортируем на шрифт так всё шрифты заработали. Единственное, что мы используем 400 a300t здесь более жирным шрифтом так. Давайте попробуем что-нибудь. Хотя меня за всё за 300 400, а так вряд ли поможет нам то есть шрифт мы подключили, но он не до конца соответствует нашим потребностям. То есть у нас должен быть шрифт 300 и 600. А у нас 300 и 700 вот немножко расхождение в жирности, ресторан, тогда назад, что же есть ли так хочется, что найдём шрифт с нужными параметрами и с курсивом то, тогда его подключен самое главное понимать принципе как и скачивать ты и как их подключать так. Давайте ещё раз посмотрим всё ли в порядке на всё в порядке. Всё правильно выводится и. Давайте Вот ещё один момент маленький сделаем шапка прописан включаемую область в которой можно менять название нашего сайта чтобы прописать включаемую область нужно сделать с авторизуйся заходим включаем можно включать в принципе режим редактирования в. Ворде изменить страницу. Так удаляем всё открываем так служебное включаемые области вставка включаемой области здесь настройках прописываем файла путь к файлу пиши сюда и здесь прописан блок печки. Это значит что. С корня сайта будет подключаться файл логов PHP копируем этот шаблон открываем. Фёдор находим и вот получается вставляются. Да так вот этот так вышел чтобы путаницы не было вот таким образом делать всё отлично тебе скучаю и в режиме правки редактируем добавить область на жена здесь. Оставляю на HTML код сохраняем у нас вернулась обратно название, что нам — это дает — это нам дает возможность шапку прописывают любое название сайта так как нам надо есть задавать параметры здесь раз — это главное так пишу. Вот так прописан в магазин так незамысловато название пусть будет всё название прописалась точно так же всегда можете поставить карте.

0 комментариев
0

Читайте также