Важно! Неверное отображение кириллических Гугл-шрифтов

[Stork.71]

Большинство тем WordPress предлагает использовать массу красивых гугл-шрифтов (google fonts). Но отображаются они зачастую неправильно. Вернее, все красиво, пока Вы пишите циферки и латинский текст. Но сайты-то у нас в основном на русском Ну и вылазит всякая хрень типа такого:

На скриншоте четко видно, что надписи на английском (Home page, e-mail) отображаются красивеньким OpenSans, в то время как все остальное заменяется банальным TimesNewRoman.
Проблема заключается в том, что при формировании кода, отвечающего за подключение гугл-шрифтов, функционал тем (даже официальных тем от woothemes) добавляет только латинскую секцию, забывая (игнорируя) кириллицу.
Для Вутика (wootique) я подключал русские гугл-шрифты так:
Нашел файлик wp-content\themes\wootique\functions\admin-functions.php
Там есть строчка

$output .= '<link href="http'. ( is_ssl() ? 's' : '' ) .'://fonts.googleapis.com/css?family=' . $fonts .'" rel="stylesheet" type="text/css" />'."\n";

заменил ее на

$output .= '<link href="http'. ( is_ssl() ? 's' : '' ) .'://fonts.googleapis.com/css?family=' . $fonts .'&subset=latin,cyrillic" rel="stylesheet" type="text/css" />'."\n";

По факту добавилось &subset=latin,cyrillic то есть подключение кириллического и латинского наборов символов вместо поумолчанческого латинского.
По поиску "fonts.googleapis.com" можно найти аналогичные строки и в любых других темах.
Наверное, все это можно сделать, и не лезя в код темы, а просто через functions.php. Если кто знает как, или сможет реализовать - плюсик в карму

К слову, в список гугл-фонтов можно добавлять и другие. Для этого надо сначала выбрать интересующий нас шрифт на google.com/fonts, и затем вставить в тот же admin-functions.php в секцию "Available Google webfont names" после объявления $google_fonts = array( (у меня это строчка эдак 1500) конструкцию типа

array( 'name' => "Roboto", 'variant' => ':r,b,i,bi'),

, где Roboto - это название интересующего шрифта; r,b,i,bi - это необходимые начертания.

Ув. Админы-Модераторы, поскольку проблема встречается в 80% из новых сайтов, представляемых на форуме, плиз оптимизируйте мой пост под поисковую выдачу - для яндекса и внутреннего поиска. Чтобы искать проще было, на что ссылку давать.

 

[D&B]

В Вутике по умолчанию корректно работают гугл шрифты поддерживающие кириллицу. Ничего вставлять в код не надо. Проверял на версии 1.6.10. Надо только включить и настроить это дело в настройках темы.



На шотах видно корректное использование шрифтов OpenSans и Roboto для примера.

Но вообще, да. Проблема такая бывает частенько. Иногда решается вставкой кода как описал Stork.71 выше. Если покупаете премиум тему, не забудьте уточнить о поддержке кириллицы у авторов.

 

[kvo]

А подтягивание гугло шрифтов не замедляет работу сайта? И можно ли их как-то установить на сам сайт?

 

[D&B]

Замедляет. Поэтому теоретически лучше использовать стандартные шрифты. Только надоели они всем уже порядком. Иногда хочется выделить как то свой сайт.

 

[kvo]

А стандартные - это какие ?

 

[D&B]

http://techmeat.net/standartnye-shrifty-dlya-sajta.html

 

[Stork.71]

Там скорее дело даже не в самой теме, а в фреймворке. У меня была старая версия (5.5), новая (6.0) вышла довольно недавно. Решил обновиться. Обновился. Все слетело
Настройки темы, слава Богу, остались, но шрифты полетели.
А где это "включается" в настройках темы? Включается именно кириллица? Не нашел
Не хочу сходу менять по-своему, хочется разобраться и сделать по-честному

 

[D&B]

Только то, что на первом скрине. Больше я ничего не трогал

 

[Stork.71]

у Вас случайно на компе эти шрифты не стоят?
гляньте плиз сайтик, может у меня глюки (хотя смотрю 3 браузерами)?: http://akip.com.ua/catalog/trexfaznye-ustrojstva/pf-80a/
Интересно: старая версия сайта, без обновы и с правками вставляет такой код подтягивания гугл-фонтов:

<!-- Google Webfonts -->
<link href="http://fonts.googleapis.com/css?family=Roboto:r,b,i,bi|Roboto+Condensed:r,b,i,bi|&subset=latin,cyrillic" rel="stylesheet" type="text/css" />

А новая такой:

<!-- Google Webfonts -->
<link href="http://fonts.googleapis.com/css?family=Roboto%3A100%2C%3A100italic%2C%3A300%2C%3A300italic%2C%3Aregular%2C%3Aitalic%2C%3A500%2C%3A500italic%2C%3A700%2C%3A700italic%2C%3A900%2C%3A900italic|Roboto+Condensed%3A300%2C%3A300italic%2C%3Aregular%2C%3Aitalic%2C%3A700%2C%3A700italic" rel="stylesheet" type="text/css" />

subset не подтягивается!
А у Вас как? Ссылку можно на тестовый?

 

[D&B]

Стоят, стоят, Вы правы. Спасибо, что напомнили. Так что, беру свои слова обратно о совместимости Вутика с кириллицей. Короче, ставим Arial и не паримся

 

[Stork.71]

Стоят, стоят, Вы правы. Спасибо, что напомнили. Так что, беру свои слова обратно о совместимости Вутика с кириллицей. Короче, ставим Arial и не паримся

А подтягивание гугло шрифтов не замедляет работу сайта? И можно ли их как-то установить на сам сайт?

Замедляют, но это сильно зависит от того, какие шрифты, какие варианты начертаний, в каком количестве Вы подтягиваете. Например, у меня на сайте используются шрифты Roboto и RobotoCondensed. Через googlefonts я могу выбрать и просмотреть варианты для подгрузки http://www.google.com/fonts#UsePlace:use : При использовании всех начертаний этих двух шрифтов в латинице и кириллице получаю цифру 384 (это какая-то относительная цифра). Если поотключать ненужные начертания - получится уже 170, а можно и еще меньше сделать.
Раньше нужных мне шрифтов Roboto в списке не было, приходилось добавлять их. Теперь они появились, но тема по умолчанию подгружает все начертания шрифта, замедляя загрузку. Так что я просто выбрал нужные, и как было описано выше изменил подгрузку, тем самым снизив нагрузку на сервер.

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

 

[Nitrat]

Есть хороший плагин для встраивания гуглевских шрифтов (пробовал многие) - https://wordpress.org/plugins/wp-google-fonts/
Я с его помощью изменил и шрифт в навигации, и сам текст - http://dom.head-wind.ru/

 

[xeniya]

<!-- Google Webfonts -->
<link href="http://fonts.googleapis.com/css?family=Roboto:r,b,i,bi|Roboto+Condensed:r,b,i,bi|&subset=latin,cyrillic" rel="stylesheet" type="text/css" />

.....subset не подтягивается!

Спасибо огромное, такая же беда была: после обновления все слетело - премиум тема Porto 2.8.2 причем есть выбор в настройках самой темы какие шрифты подгружать, но работало 50/50 т.е. в некоторых браузерах вместо OpenSans - TimesNewRoman с засечками, бя(( . Ну собственно вдруг кому тоже случайно пригодится, т.к код в этой теме чуть другой, но все заработало. Идем wp-content/themes/porto/functions.php и вместо

wp_register_style( 'porto-google-fonts', "//fonts.googleapis.com/css?family=" . $font_family . $charsets );

ставим

wp_register_style( 'porto-google-fonts', "//fonts.googleapis.com/css?family=OpenSans:r,b,i,bi|&subset=latin,cyrillic". $font_family . $charsets );

 

[Savinoff]

Что бы не плодить темы спрошу здесь:
WP 4.7
Тема: ShopStar
Цифры и знаки препинания в Витрине отображаются тонкими. Шрифт как я понял Raleway Dots. Везде где смог прописал в св-вах шрифта Normal, не помогло. Если запустить Yellow pencil, в разделе шрифтов нажать inherit, цифры и знаки препинания меняются на нормальные, но у меня lite версия и не дает сохранить изменения. Как в теме поменять family шрифт или проще купить про версию желтого карандаша.

 

[D&B]

Установите другой шрифт с поддержкой кириллицы. Например, с помощью этого плагина.