Как подключить свой шрифт к WordPress

Бывают ситуации, когда заказчик настаивает на шрифте, которого нет в теме. Если он знает название требуемого шрифта, то подключение его к Вордпресс занимает 10 минут.

Рассмотрим это на примере шрифта TT Norms Light.

1. Гуглим разработчика шрифта. В нашем случае шрифт распространяется бесплатно, что радует.
2. Скачиваем файлы с расширениями OET, TTF и WOFF.
3. Помещаем их в ту же папку, где лежит style.css
4. В самом style.css прописываем следующий код:
   @font-face {
   font-family: ‘TT Norms Light’;
   src: url(‘TTNorms-Light.eot’);
   src: url(‘TTNorms-Light.eot?#iefix’) format(’embedded-opentype’),
   url(‘TTNorms-Light.woff’) format(‘woff’),
   url(‘TTNorms-Light.ttf’) format(‘truetype’);
   font-weight: normal;
   font-style: normal;
   }
5. А дальше вы можете присвоить этот шрифт любому содержимому. Например
   .my_font {font-family: ‘TT Norms Light’;}
   Можете заменить все шрифты на новый, можете свой стиль присвоить определенным блокам – дело ваше.

Внимание! Код должен быть прописан в файле style.css, в разделе Дополнительные стили он у меня почему-то не заработал.

По аналогии можно использовать любой шрифт, заменив названия.

Как подключить свой шрифт к Slider Revolution

В принципе, все то же самое.

1. Скачиваем, распаковываем и загружаем шрифты
2. Прописываем абсолютные пути к файлам шрифтов:
   @font-face {
   font-family: ‘open_sansbold’;
   src: url(‘http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.eot’);
   src: url(‘http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.eot?#iefix’) format(’embedded-opentype’),
   url(‘http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.woff’) format(‘woff’),
   url(‘http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.ttf’) format(‘truetype’),
   url(‘http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.svg#open_sansbold’) format(‘svg’);
   font-weight: normal;
   font-style: normal;
   }
3. Полученный код размещаем в разделе Custom CSS/Javascript на странице настроек конкретного слайдера.
4. При редактировании текста слайда вручную вводим название шрифта в соответствующее поле.

Внимание! Заголовки так не редактируются. Им приходится присваивать каждому нужный стиль.

На английском языке все доступно изложено на сайте разработчика.