Как изменить шрифты в WordPress без хлопот
Шрифты в WordPress являются важной частью брендинга компании. Хотя некоторые могут отмахнуться от шрифтов как от неуместных, для многих они являются неотъемлемой частью их веб-сайта.
Наряду с цветами, изображениями, логотипами и другими элементами брендинга шрифты играют жизненно важную роль в имидже вашего бренда и в том, как клиенты воспринимают ваш бренд. Поскольку они предлагают множество вариантов, WordPress является одной из лучших платформ для настройки.
Несмотря на то, что существует множество бесплатных вариантов шрифтов, очень важно знать, как менять шрифты в WordPress, для чего могут потребоваться некоторые знания кодирования CSS.
Эта статья, созданная нашей командой в wpDataTables, продемонстрирует, как легко менять шрифты в WordPress.
Как изменить шрифты в темах WordPress
Давайте рассмотрим следующий сценарий. Вы хотите разные комбинации шрифтов для своего сайта, но что-то мешает вам двигаться вперед.
Изменение шрифтов в темах может быть сложной задачей, поскольку они обычно поставляются с предустановленными шрифтами, которые используются в различных частях темы. Вам нужно найти сценарий CSS, который устанавливает шрифт для определенной области, будь то нижний колонтитул, заголовок, основной текст или другие части.
Некоторое предварительное кодирование потребуется, если вы хотите использовать совершенно новый шрифт. Сначала выберите лицензионный шрифт для своего сайта, а затем загрузите его на сервер. В верхней части файла style.css вам также необходимо определить семейство шрифтов. Вот пример того, как может выглядеть код:
@font-face {font-family: Museo300;
src: local('Museo300-Regular'),
url("fonts/Museo300-Regular.ttf") format('truetype’);
font-weight: normal;}Как изменить шрифты в WordPress глобально с помощью функции настройки
Изменить шрифты с помощью функции настройки очень просто. Сначала войдите в свой профиль WordPress и получите доступ к панели инструментов, нажмите «Внешний вид», а затем «Настроить».
Другой способ получить доступ к этой области — войти в панель управления WordPress, щелкнуть имя сайта в левом верхнем углу, а затем нажать кнопку «Настроить».
Затем прокрутите вниз до левой стороны и найдите поле, в которое вы можете добавить дополнительный код CSS. Нажмите на нее, чтобы добавить код. Вот пример кода:
* {font-family:"Courier New", Courier, monospace}CopyКогда вы добавите * в начале, он добавит шрифт на весь сайт. Когда вы вставите код, он мгновенно изменится. Когда вы будете готовы внести изменения, нажмите кнопку «Опубликовать».
Как изменить шрифты в WordPress в определенных областях темы
Темы поставляются с предустановленными шрифтами в различных областях, и вам потребуются разные шрифты для разных областей вашего сайта, что добавляет возможности настройки. Выявление тем в разных областях является сложной задачей.
Вы найдете шрифт для тела, отдельный от остальных, который можно использовать для определения шрифтов, не определенных тегом, классом или div.
body {font-family: Verdana, Arial, Helvetica, Futura, sans-serif;
font-size: 1em;
padding:0;
margin:0; }Вероятно, вы найдете шрифты в различных классах CSS: контент, пост, запись и пост-запись.
Добавить пользовательские шрифты
Добавление пользовательских шрифтов — один из лучших способов изменить заголовки и базовый шрифт. Перейдите в раздел «Дизайн» > «Настроить» > «Шрифты».
Перейти на пользовательский шрифт очень просто. Есть много отличных шрифтов, которые можно найти в Google Fonts, Typekit и, наконец, с премиальной подпиской WordPress или выше.
Как это сделать:
- Перейти к дизайну >
- Нажмите «Шрифты» в разделе «Настроить». Затем щелкните раскрывающееся меню, чтобы увидеть параметры, доступные в разделе «Заголовки».
- Если шрифты здесь не видны, то тема, вероятно, не предлагает возможность изменить шрифты на пользовательские шрифты. В этом случае найдите другую тему, которая предлагает эту опцию.
- Шрифты часто идут парами, один для заголовков, а другой для тела. Для заголовков важно выбрать шрифт, который подходит для заголовков, заголовков виджетов, заголовков комментариев и других областей страницы. Базовый шрифт будет шрифтом для основного текста, поэтому сделайте его как можно более разборчивым.
- Вы увидите предварительный просмотр в реальном времени, прежде чем сможете выбрать шрифт.
Как настроить размер и стиль шрифта
Чтобы настроить стиль шрифта, щелкните параметр слева от шрифта. Вам будут доступны разные стили, в зависимости от выбранного шрифта.
Чтобы настроить размер шрифта, перейдите к параметру размера ниже и настройте размер шрифта. Сделайте его подходящим для заголовков или для тела, что легко сделать из раскрывающегося меню.
Премиум-подписка WordPress или выше позволяет изменять размер шрифта в коде CSS.
Как сохранить шрифты
Когда вы закончите настройку параметров, шрифт сохранится двумя способами: нажав «Опубликовать свой сайт» или «Сохранить черновик».
После сохранения подождите пару минут, пока шрифты не появятся в блоге. Если они не отображаются, попробуйте очистить кеш браузера, чтобы убедиться, что это последняя версия сайта.
Как изменить шрифты
Вот как изменить шрифты в WordPress после того, как вы создали собственный шрифт.
Измените пользовательские шрифты, выбрав «Дизайн», а затем «Настроить». Затем перейдите в «Шрифты», выберите другой заголовок или базовый шрифт. Вы также можете вернуться к шрифту по умолчанию, нажав X, который расположен справа от имени пользовательского шрифта.
Чтобы завершить изменения шрифта, нажмите «Опубликовать» или «Сохранить черновик».
Опять же, для отображения шрифтов может потребоваться несколько минут, и необходимо очистить кеш браузера.
Сброс шрифтов
Чтобы сбросить шрифты, просто нажмите X рядом с текущим шрифтом, который вы используете.
Как поставить шрифты в очередь
Чтобы правильно добавить шрифты для WordPress, вам потребуется изменить различные файлы; самое главное, файл functions.php, или файл function_wp; enqueuer_script и wp_enqueue_style.
С помощью фрагментов кода просто измените шрифт, не вводя код в файлы. Просто добавьте их в заголовок через функцию.
Wp_enqueue_script и wp_enqueue_style — похожие файлы, поэтому лучше изменить файл стиля в зависимости от того, что предлагает ваш поставщик шрифтов.
Google Fonts предоставит шрифты в виде таблиц стилей, поэтому добавьте их следующим образом:
function add_google_fonts() {Другие шрифты, такие как веб-шрифты Adobe Edge, будут представлены в виде файлов Javascript. Код будет выглядеть так:
function add_adobe_fonts() {Когда вы знаете, где изменить шрифт, эта функция становится простой.
Как изменить размер шрифта
Настройка размера шрифта является фундаментальной, просто регулируя размеры заголовков. При использовании визуального редактора все параметры находятся на вкладке «Абзац».
Обычно размеры шрифтов контролируются файлом style.css, который обеспечивает доступ к размерам шрифтов.
Использование правильных заголовков в статьях необходимо для создания удовлетворительного пользовательского опыта, а также для повышения SEO-оптимизации.
Если вам понравилось читать эту статью о том, как изменить шрифты в WordPress, вы должны прочитать эту статью о том, как загрузить медиатеку WordPress.
Мы также писали о нескольких связанных темах, таких как, как найти идентификатор страницы в WordPress, как встроить WordPress iframe, как устранить код JavaScript и CSS, блокирующий рендеринг, в содержимом верхней части страницы, как остановить DDoS-атаку и как чтобы скрыть заголовок страницы в WordPress.