—»     —»   Google Typography: плагин Google Fonts для Wordpress
  Раздел: Wordpress   Нет комментариев  

Google Typography: плагин Google Fonts для Wordpress



При помощи бесплатного плагина для Wordpress под названием Google Typography, вы можете использовать любой Google-шрифт на страницах своего сайта без необходимости заглядывать в код шаблона.

Один из важнейших аспектов веб-дизайна заключается в подборке подходящего шрифта. Дизайн с хорошей типографикой не только позволяет вам удостовериться в удобочитаемости вашего текста, но и также, при помощи различий в размерах и стилях шрифтов, позволяет вам акцентировать внимание на продукции, услугах, выделять специальные сообщения и призывать к действую. Так как шрифты являются ключевым компонентом дизайна и работы с контентом, было бы хорошо иметь под рукой готовое гибкое решение, позволяющее без труда справляться с подборкой шрифтов, их цветов и так далее.

Зачастую пользователи Wordpress получают отличный контроль над шрифтами сайта в целом при установке профессиональных шаблонов Wordpress. Все больше и больше шаблонов наделяют функционалом подбора шрифта за счет которых вам не нужно даже заглядывать в код страниц. Тем не менее, пока еще такие возможности встречаются нечасто, и для таких моментов идеальным решением станет бесплатный плагин Google Typography.

Сегодня мы хотим рассказать вам о Google Typography – бесплатном плагине, который позволяет пользователям устанавливать шрифты на сайте с использованием веб-шрифтов Google. Плагин предлагает простенький интерфейс, который поможет вам определить шрифты, выбрав подходящий и установив нужный размер и цвет. Выбранные шрифты без труда применяются к вашему веб-сайту посредством CSS-селекторов. Давайте взглянем на плагин поближе.

Сам плагин можно установить из Консоли, посредством поиска по плагинам, либо посредством загрузки zip-файл на сервер. После установки, настройки плагина станут доступными во вкладке Внешний вид в Консоли.

Google Typography: плагин Google Fonts для Wordpress

У плагина есть отдельная страница с настройками. Нижеприведенное изображение демонстрирует нам экран приветствия.

Google Typography: плагин Google Fonts для Wordpress

Добавлять новые шрифты не так уж и сложно. Просто нажмите на кнопку «Add New».

Google Typography: плагин Google Fonts для Wordpress

После нажатия по кнопке, перед вами появится пустое текстовое поле. Сюда можно вписать текст, чтобы видеть, как текст будет смотреться с выбранным шрифтом. Ниже вы можете видеть поля для указания настроек шрифта.

Google Typography: плагин Google Fonts для Wordpress

Выпадающее меню позволяет вам выбирать шрифт. Здесь также представлены дополнительные настройки и CSS-селектор.

Google Typography: плагин Google Fonts для Wordpress

Вы можете добавить столько шрифтов, сколько посчитаете нужным.

Google Typography: плагин Google Fonts для Wordpress

Как найти CSS-селектор в Chrome

Если вы не уверены насчет того, за какой отрезок текста на странице отвечает тот или иной селектор, вы можете воспользоваться функцией Проверки Элемента в Chrome. Если вы используете Firefox, то подобный функционал можно найти в расширении Firebug. Просто выделите текст, который вы хотите изменить, и кликните правой кнопкой мыши, а в появившемся меню опцию «Проверить элемент». Эта опция позволяет пользователям получать CSS-коды для отдельных фрагментов и элементов на странице. Этот код можно использовать для изменения используемых на странице стилей шрифта. В данном случае мы будем использовать “a.button”, чтобы изменить шрифт кнопки, показанной на примере.

Google Typography: плагин Google Fonts для Wordpress

После того, как вы найдете соответствующий CSS-код, копируйте его и вставляйте в CSS-селектор, как показано на изображении ниже.

Google Typography: плагин Google Fonts для Wordpress

После сохранения, шрифт на кнопке будет изменен в соответствии с внесенными изменениями, которые вы сделали в плагине Google Typography.

Google Typography: плагин Google Fonts для Wordpress

Шрифты повышают удобочитаемость, если их правильно использовать. Зачастую в этом помогают правильно подобранные шрифты, а также их размеры и цвета. С плагином Google Typography, все что вам остается сделать, это просто выбрать подходящий шрифт. Плагин очень удобен в использовании, тем не менее, здесь пока еще отсутствуют расширенные настройки шрифтов, включая, к примеру, высоту строки. В целом, плагин выполнен таким образом, что позволяет без труда находить и применять шрифты на сайтах, основанных на Wordpress. Если вам нужно больше информации по поводу данного плагина, то посмотрите эту страницу.
Обнаружили ошибку или мёртвую ссылку?
Выделите проблемный фрагмент мышкой и нажмите CTRL+ENTER.
В появившемся окне опишите проблему и отправьте уведомление Администрации ресурса.
Нужна органическая вечная ссылка из данной статьи? Постовой?
Подробности здесь
Вам понравился материал? Поблагодарить легко!
Будем весьма признательны, если поделитесь этой статьей в социальных сетях:

Ключевые тэги: Wordpress, Google Fonts, шрифты
Опубликовал Design FactoRy   Прочитано (раз): 4475   |   Нет комментариев
Автор перевода — CoolWebmasters.Com ©   |   Источник материала / оригинал статьи   Распечатать
Другие статьи и новости по теме:
Добавление комментария
Уважаемые пользователи!
При добавлении комментариев на сайт Вам следует учитывать следующее - все комментарии проверяются Администрацией на предмет отсутствия спама. При обнаружении признаков спама, в оставленном Вами комментарии, сам комментарий будет незамедлительно удалён, а Ваш IP-адрес будет забанен без предупреждения! Учётные записи пользователей, рассылающих спам, блокируются/удаляются без права последующего восстановления.

С уважением, Администрация сайта.
* = поля обязательны к заполнению
Полужирный Наклонный текст Подчеркнутый текст Зачеркнутый текст | Выравнивание по левому краю По центру Выравнивание по правому краю | Вставка смайликов Выбор цвета | Скрытый текст Вставка цитаты Преобразовать выбранный текст из транслитерации в кириллицу Вставка спойлера
Вопрос : Назовите месяц October по-русски
Подтверждение кода безопасности :

Включите эту картинку для отображения кода безопасности
обновить, если не виден код


Популярные публикации


















Свежие шаблоны сайтов каждый день
С миру по нитке
«    Июнь 2017    »
ПнВтСрЧтПтСбВс
 1234
567891011
12131415161718
19202122232425
2627282930