Подбор и подключение шрифтов на сайте WordPress без плагинов

Артем Абрамович

Меня зовут Артем Абрамович и я являюсь фрилансером-вордпресером. Занимаюсь настройкой и редактированием сайтов созданных на CMS WordPress. Это основная моя специализация, есть еще несколько работ, которыми я занимаюсь, но обо этом вы можете более подробно узнать из моего портфолио.

46 комментариев к “Подбор и подключение шрифтов на сайте WordPress без плагинов”

  1. Спасибо за интересную и полезную информацию! Очень понятное объяснение.Буду осваивать!

    Ответить
  2. Здравствуйте! я подключил переделанный мною шрифт, вроде все правильно сохранил, подключил, на сайте отображается, но единственное, во первых:
    Ругается сам гугл — http://prntscr.com/avx5qb (я пока не понял, что за именно предупреждение)
    Во вторых:
    Именно на главной странице и только при просмотре с ПК, шрифт заголовков сжимается по вертикали — я никак не смог определить почему, так как в остальных страницах всё замечательно — http://prntscr.com/avx6cq
    Надеюсь на ваши подсказки, заранее спасибо.

    Ответить
    • +Bibars_Design
      Добрый вечер!
      1. Эта ошибка говорит, что не догружается файл шрифта. По моему такого шрифта нет в гугле
      2. Такое сжатие может давать сам браузер. Проверьте отображение шрифтов в другом браузере и на другом компьютере

      Ответить
    • +WPRUSe 1)Да в гугле этого шрифта нет, значит просто убрать эту строку подключения?…так как шрифт отдельный не относящийся к строке, получается?
      2)Нет, проверял, везде одно и тоже, и я заметил он дополнительный, загруженный шрифт так же сжимает по горизонтали…В css такого нет, не могу понять из за чего…

      Ответить
    • +Bibars_Design
      Да просто надо убрать, тогда ошибки не будет
      Значит шрифт так отображается в браузерах. Это уже шрифт такой…

      Ответить
  3. Спасибо за урок, а в каком файле можно увеличить шрифты Заголовков H1 и Подзаголовка H2?

    Ответить
  4. Друг, ты ведь все равно монтировал видео, зачем оставлять кусок с ошибкой? Вырезал бы и залил по новой. Качество материала уже было бы на порядок выше!

    Ответить
    • Не ошибается тот, кто ничего не делает. В такой ошибке нет ничего страшного, главное что я ее нашел и устранил. Да, может быть со стороны это выглядит не профессионально, но все когда то были новичками и если вдруг вылезают ошибки, то в этом нет ничего страшного. Главное, что ошибка исправлена.

      Перезалить — на Ютубе это проблема (ну по крайней мере я не знаю как это сделать, если знаете, напишите), проще ролик записать по новой.

      Ответить
  5. А у меня в теме нет папки Fonts. Что делать? И в архиве всего один файл, хотя скачивал тоже брадобрей.

    Ответить
  6. По умолчанию в описания товаров текст вставляется с огромными пробелами при вставке. Как настроить, чтобы текст копировался компактно и без лишнего кода?
    И для очистки cache это какой-то плагин?

    Ответить
    • Что за пробелы (между абзацами, словами. буквами), и откуда текст вставляется?

      Ответить
  7. Подскажите как убрать из темы ссылку подгрузки с гугла ненужных шрифтов. Нужно лезть в function.php? боюсь ковырять т.к опыта почти нет.

    Ответить
    • не силен в php скажите правильно ли я сделал переведя параметр в переменных шрифтов на off, строчка подгрузки шрифтов пропало но корректно ли это?

      * Load Google Fonts
      */
      function hitmag_fonts_url() {
      $fonts_url = »;

      $lato = _x( ‘off’, ‘Lato font: on or off’, ‘hitmag’ );

      $ubuntu = _x( ‘off’, ‘Ubuntu font: on or off’, ‘hitmag’ );

      $open_sans = _x( ‘off’, ‘Open Sans font: on or off’, ‘hitmag’ );

      if ( ‘off’ !== $lato || ‘off’ !== $ubuntu || ‘off’ !== $open_sans ) {
      $font_families = array();

      if ( ‘off’ !== $ubuntu ) {
      $font_families[] = ‘Ubuntu:400,500,700’;
      }

      if ( ‘off’ !== $lato ) {
      $font_families[] = ‘Lato:400,700,400italic,700italic’;
      }

      if ( ‘off’ !== $open_sans ) {
      $font_families[] = ‘Open Sans:400,400italic,700’;
      }

      $query_args = array(
      ‘family’ => urlencode( implode( ‘|’, $font_families ) ),
      ‘subset’ => urlencode( ‘latin,latin-ext’ ),
      );

      $fonts_url = add_query_arg( $query_args, ‘//fonts.googleapis.com/css’ );
      }

      return $fonts_url;
      }
      /**
      * Enqueue Google fonts.
      */
      function hitmag_font_styles() {
      wp_enqueue_style( ‘hitmag-fonts’, hitmag_fonts_url(), array(), null );
      }
      add_action( ‘wp_enqueue_scripts’, ‘hitmag_font_styles’ );

      Ответить
    • Можно и так, если все работает. Только при обновлении темы сие может слететь, надо через дочернюю тему делать

      Ответить
  8. Подскажите пожалуйста, шрифты, которые я загрузил в папку fonts в папке с темой затираются при ее обновлении или нет? Если я для правки кода использую сниппеты типа Code Snippets и Simple CSS, то нужно ли мне еще дополнительно устанавливать дочернюю тему специально для шрифтов? Или можно просто в корне — в «wp-content» — создать папку fonts и туда залить кастомные шрифты?

    Ответить
    • В корне — в «wp-content — однозначно нельзя — это системная папка самого ВП
      Если тема обновляемая, то все надо делать через дочернюю тему, иначе все слетит при обновлении

      Ответить
  9. А что это за прикольный вид меню? Это win 10?
    2/ Можно ли из темы удалить шрифты? Там куча уродских и ненужных шрифтов в настройке. Или лучше не трогать? Или можно сделать безболезненно? Или не стоит?)

    Ответить
    • Если шрифты не нужны, то можно и удалить. Но только процедура эта сложная

      Ответить
    • Ладно, не буду пока трогать. Я думаю лучше делать так, чтобы в код не вмешиваться, до тех пор, пока это возможно. Особенно, если точно не знаешь как это делать)

      Ответить
  10. Очень не хорошее название темы, вводящее в заблуждение. У меня есть шрифты, отлично работающие через опен сервер и на HTML верстке. Хотел посмотреть в видео, исходя из названия, алгоритм подключения.
    В итоге по факту имеем в видео «фразу»: папочка CSS подключена, просто копируем шрифты. Она у меня (и наверняка не только у меня) уже есть со шрифтами и хотелось её подключить, как я понимаю через bloginfo.
    Увы и ах(

    Ответить
    • Не понял вопроса. Обычно величина пробелов от самого шрифта зависит

      Ответить
  11. Да это хрень, подругому проще делается через ссылку на сайт со шрифтами

    Ответить
  12. Многие ваши видео прорабатываю на своем сайте. Не можете подсказать как не меняя шрифт на сайте увеличить размер шрифта в гутенберге Вордпресс, думаю такая инфо пригодится не только мне. Ведь Гугл накладывает санкции на мелкий шрифт особенно на мобильные версии. У меня был шрифт более менее, но при настройке плагина clearfy он уменьшился. Теперь голову ломаю как увеличить шрифт сразу на всем сайте или хотя бы по целым статьям, но не по блокам. Так у меня на сайте

    Ответить
    • Если для шрифтов нет настроек для управления шрифтами, то проще через css это сделать, плагины иногда не дают нужной свободы

      Ответить
    • @Финты WordPress Но в редакторе Гутенберг Вордпресс как раз есть изменение шрифтов по величине, но только отдельно по блокам. Там есть шрифты по умолчанию, мелкий, средний, большой, очень большой. Я и подумала может есть какая-то изюминка чтобы сразу на всем сайте поменять хотя бы на средний. Но по блокам не реально менять величину шрифта.

      Ответить
    • Гутенберг работает только с текстом страницы, если надо глобально на всем сайте, то придется или плагин искать или через css править

      Ответить
  13. Чего-то просмотров тьма, а лайков мало!? Непорядок! Подкину свой лайкос. Видос зачетный, Артем спасибо.

    Ответить

Добавить комментарий

%d такие блоггеры, как: