Если данный туториал не то, что Вы искали, у Вас все еще остались вопросы или предложения - дайте нам знать. Пожалуйста, помогите нам обслуживать Вас лучше!

Ваше имя

Ваш e-mail

Ваше сообщение (обязательно)

captcha

Новые шаблоны

WordPress. Как добавить пользовательский шрифт

Из этого туториала вы узнаете, как добавить пользовательский шрифт в WordPress.

WordPress. Как добавить пользовательский шрифт

Если вы хотите добавить пользовательский шрифт на ваш сайт WordPress сначала надо найти и загрузить этот шрифт на компьютер. Например, с этого сайта: http://www.fontsquirrel.com.

  1. Посетите сайт http://www.fontsquirrel.com., и в «Фильтре шрифтов» (‘Font Filter’), выберите ‘Веб-шрифт’ (Webfont):

    Wordpress_How_to__add_a_custom_font-1

  2. Выберите понравившийся вам шрифт и скачайте его на компьютер:

    Wordpress_How_to__add_a_custom_font-2

  3. Соединитесь с сервером с помощью FTP или Менеджера файлов, перейдите к каталогу ‘wp-content/themes/themeXXXX‘ и создайте там новую папку под названием ‘fonts’. Загрузите скачанный шрифт в эту папку, а затем распакуйте файл(ы). Оригинальный .zip файл после этого можно удалить:

    Wordpress_How_to__add_a_custom_font-3

  4. Войдите в панель управления WordPress. Перейдите в раздел Внешний вид (Appearance) -> Редактор (Editor) и откройте файл ‘style.css‘ из темы themeXXXX:

    Wordpress_How_to__add_a_custom_font-4

  5. Добавьте такой код в конец этого файла ‘style.css‘:

      @font-face { 
      font-family: fontname; 
      src: url('link'); 
    }

    *здесь: название шрифта (fontname) = название, которое вы дадите своему новому шрифту (любое название).

    ссылка (link) = прямая ссылка на файлы шрифтов, которые вы загрузили на сервер. (ссылка на сайт + путь к каталогу + название файла шрифтов):

    Wordpress_How_to__add_a_custom_font-5

  6. Скопируйте код в последнюю строку файла ‘style.css‘ и удалите вторую строку кода с ‘src‘, а затем добавьте метку !important после названия шрифта:

    Wordpress_How_to__add_a_custom_font-6

  7. Вы можете найти класс CSS для конкретного текста с помощью инструмента разработчика:

    Wordpress_How_to__add_a_custom_font-7

  8. Замените @font-face классом CSS (селектором CSS), найденным с помощью инструмента разработчика. Затем нажмите ‘Загрузить файл’ (‘Upload File’):

    Wordpress_How_to__add_a_custom_font-8

  9. Обновите сайт, чтобы увидеть новый пользовательский шрифт.

Вы также можете воспользоваться детальной видео-инструкцией:

WordPress. Как добавить пользовательский шрифт

 
Начать чат