Korzystając z czcionek Google Fonts, możesz natrafić na nieprawidłowości związane z wyświetlaniem polskich znaków. Problem może być widoczny tylko w niektórych przeglądarkach i wybranych systemach operacyjnych. W takim przypadku cały tekst wyświetla się prawidłowo, oprócz polskich znaków, które mają inny krój czcionki. W innym przypadku tylko początek tekstu jest wyświetlany prawidłowo, aż do wystąpienia pierwszego polskiego znaku.
Polskie znaki w Google Fonts – rozwiązanie
Rozwiązanie problemu jest bardzo proste. Wystarczy dodać jeden parametr &subset=latin,latin-ext do linku dołączającego czcionki do strony.
Link bez parametru
<link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet"> Link z parametrem
<link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap&subset=latin,latin-ext" rel="stylesheet"> Rozwiązanie zadziała, jeśli dana czcionka obsługuje rozszerzony zestaw znaków Latin Extended.
W którym miejscu kodu powinienem wkleić poprawiony link?
Jeśli strona jest wykonana na WordPressie, to link należy wstawić korzystając z funkcji wp_enqueue_scripts.
W razie problemów można również skorzystać z wtyczki: Fonts Plugin | Google Fonts Typography https://wordpress.org/plugins/olympus-google-fonts.
Natomiast jeśli jest to statyczna strona, to link należy wstawić pomiędzy znacznikami head.
a jest opcja aby laik wstawił kod korzystając z funkcji?
Tak, oczywiście 🙂 Przygotuję za przyszły tydzień specjalny artykuł o tym jak dodać Google Fonts do WordPressa przy użyciu wtyczki, a także bez. Dziękuję za pomysł na nowy artykuł 😉
Dzięki i nie ma sprawy 😉
Co do wtyczki to strasznie spowolniła mi stronę, a dodatkowo wyskakiwał mi błąd 500 (czytałem, że czasami może się pojawiać po zainstalowaniu wtyczki).
Czekam na artykuł jak na pierwszą gwiazdkę 🙂
Artykuł jest już gotowy: https://monikaszeliga.pl/jak-dodac-wlasna-czcionke-do-wordpressa/
Serdecznie zapraszam 🙂
Dodam jeszcze, że moja czcionka motywu – open sans wyświetla się poprawnie kiedy jestem zalogowany do panelu admina w wordpress. Kiedy natomiast się wylogowuje to polskie litery odróżniają się od pozostałych. Efekt ten nie występuję na przeglądaniu strony na komórce.
Jest jakieś rozwiązanie tego problemu?
Sądzę, że może pomóc wyczyszczenie cache na stronie
Niestety wyczyszczenie cache nic nie dało
Cześć. Zastanawia mnie czemu czcionka z linku google fonts pobiera wszystkie rodzaje „języków” od greki po wietnamskie ustawienia mimo użytej opcji „subset=latin, latin-ext”. Czy jest jakaś komenda opcja, która spowoduje pobieranie tylko łacińskich liter? Przy obecnej sytuacji spowalnia się wydajność strony. P.S. nie używam wordpress’a
Można spróbować zastosować właściwość unicode-range. Dzięki za komentarz, ponieważ podsunął mi pomysł na kolejny poradnik odnośnie optymalizacji fontów 😉
Po co obciążacie/spowalniacie strony tymi fontami google, które nie tylko zwykle wyświetlają się niepoprawnie, ale na dodatek często lubią kaleczyć polskie znaki?
Jaki to ma sens?
Zaletą Google Web Fonts jest to, że są bardzo proste w implementacji. Oczywiście tak jak w przypadku każdego rozwiązania istnieją wady i zalety 😉