• Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!
  • Темы озаглавленные с маленькой буквы или капсом удаляются без предупреждения!

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

Image CMS

Stork.71

Гуру
Местный
#1
Большинство тем WordPress предлагает использовать массу красивых гугл-шрифтов (google fonts). Но отображаются они зачастую неправильно. Вернее, все красиво, пока Вы пишите циферки и латинский текст. Но сайты-то у нас в основном на русском ;) Ну и вылазит всякая хрень типа такого:
2014-10-28_082611.jpg
На скриншоте четко видно, что надписи на английском (Home page, e-mail) отображаются красивеньким OpenSans, в то время как все остальное заменяется банальным TimesNewRoman.
Проблема заключается в том, что при формировании кода, отвечающего за подключение гугл-шрифтов, функционал тем (даже официальных тем от woothemes) добавляет только латинскую секцию, забывая (игнорируя) кириллицу.
Для Вутика (wootique) я подключал русские гугл-шрифты так:
Нашел файлик wp-content\themes\wootique\functions\admin-functions.php
Там есть строчка
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) конструкцию типа
PHP:
array( 'name' => "Roboto", 'variant' => ':r,b,i,bi'),
, где Roboto - это название интересующего шрифта; r,b,i,bi - это необходимые начертания.

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

D&B

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

Wootique 1.jpg Wootique 2.jpg Wootique 3.jpg

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

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

kvo

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

D&B

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

Stork.71

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

D&B

Администратор
Команда форума
Местный
#8
Только то, что на первом скрине. Больше я ничего не трогал
 

Stork.71

Гуру
Местный
#9
у Вас случайно на компе эти шрифты не стоят?
гляньте плиз сайтик, может у меня глюки (хотя смотрю 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

Администратор
Команда форума
Местный
#10
Стоят, стоят, Вы правы. Спасибо, что напомнили. Так что, беру свои слова обратно о совместимости Вутика с кириллицей. Короче, ставим Arial и не паримся ;)
 

Stork.71

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

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

xeniya

Форумчанин
#13
Код:
<!-- 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 );
 
Последнее редактирование:
#14
Что бы не плодить темы спрошу здесь:
WP 4.7
Тема: ShopStar
Цифры и знаки препинания в Витрине отображаются тонкими. Шрифт как я понял Raleway Dots. Везде где смог прописал в св-вах шрифта Normal, не помогло. Если запустить Yellow pencil, в разделе шрифтов нажать inherit, цифры и знаки препинания меняются на нормальные, но у меня lite версия и не дает сохранить изменения. Как в теме поменять family шрифт или проще купить про версию желтого карандаша.
 

Вложения

Сверху Снизу