22.07.2017

Dodajemy czcionki Google na Blogspot

Jeżeli prowadzisz blog na bloggerze i posiadasz któryś z szablonów domyślnych bloggera, to z pewnością nieraz zadziwiał Cię dość ubogi wybór czcionek na tymże szablonie. Cóż... nie da się ukryć, że z propozycjami czcionek nie zaszaleli. Szału nie ma, wyboru zbytnio również.

Ale nie martw się, jest na to prosta rada! Możesz śmiało wstawić nową czcionkę spośród wielu czcionek Google! :)

Dodajemy czcionki Google na Blogspot


Najsampierw musimy wejść na stronę fonts.google.com. To właśnie dzięki tej stronie zyskamy możliwość wyboru całkowicie nowych czcionek na nasz blog.

Po wejściu na stronę ustawiamy filtr, który pomoże nam odnaleźć tę jedną wymarzoną czcionkę z naszych snów. Powiedzmy, że mamy zamiar znaleźć czcionkę wyglądającą na pismo odręczne (Handwriting). 


Dodajemy czcionki Google na Blogspot


Należy przy tym pamiętać, aby zawsze, ale to zawsze sprawdzać, czy dana czcionka uwzględnia polskie znaki na obszarze, którym chcemy ją objąć. W przeciwnym razie może zdarzyć się tak, iż polskie litery typu ż, ą, ź będą po prostu nam znikać w tekście.

Kiedy już wybraliśmy określoną czcionkę, wówczas naciskamy przycisk plusa. Otworzy nam się nowe okienko.

Dodajemy czcionki Google na Blogspot

W tymże okienku mamy kilka kodów. Który jest do czego? To bardzo proste.

Pierwszy kod dodajemy do sekcji <head>. Należy zawsze pamiętać, aby zamknąć znacznik <link>. W zaznaczonym kodzie ów znacznik nie jest zamknięty, a inaczej nie ma możliwości zapisania kodu HTML bloga. W tryb edycji kodu HTML wchodzimy poprzez Motyw → Edytuj kod HTML.

Na pocieszenie dodam, że w chwili obecnej w mojej sekcji <head> na blogu nie ma kodu z fontów google, a czcionki i tak działają. :) Najwyraźniej nie jest on aż tak niezbędny.

Oczywiście na tym jednak nie koniec. Wracamy do okienka ze strony z fontami, a następnie klikamy w zakładkę oznaczoną jako '@IMPORT'. Cóż my tam mamy ciekawego?

Dodajemy czcionki Google na Blogspot

A więc <style>... Co to oznacza w praktyce? Musimy wejść do układu bloga, po czym dodać gadżet HTML/JavaScript.

Dodajemy czcionki Google na Blogspot

W tymże gadżecie HTML/JavaScript wklejamy ww. kod <style> zamieszczony w okienku na stronie z fontami. Całość powinna wyglądać następująco:

Zapisujemy zmiany i teraz możemy już spokojnie przejść do ostatniego kroku: kodu CSS bloga.

Dodajemy czcionki Google do kodu CSS bloga


Możemy dodać kod CSS na trzy sposoby: poprzez Projektant motywów Bloggera [Zaawansowane → Dodaj arkusz CSS] bądź też bezpośrednio poprzez kod HTML bloga. Jeżeli wybierzemy drugi sposób, musimy wkleić kod przed frazą  ]]></b:skin>   - czyli tam, gdzie zazwyczaj wstawia się kody CSS na blog.

Dodajemy czcionki Google do kodu CSS bloga

Dodajemy czcionki Google do kodu CSS bloga

A co z trzecim sposobem? Cóż, wydaje się chyba najbardziej oczywisty. Polega na wklejeniu kodu bezpośrednio w dany element CSS, np. w .post-body

Czy wstawione czcionki google działają na blogu? Oceńcie sami.

Dodajemy czcionki Google do kodu CSS bloga

Dodajemy czcionki Google do kodu CSS bloga

Share:
Introwertyczka na Bloggerze Introwertyczka na Wordpressie Introwertyczka na Weebly Introwertyczka na Facebooku Introwertyczka na Twitterze Introwertyczka na Tumblerze Introwertyczka na Youtube Introwertyczka na Pinterest Introwertyczka na We♥it Introwertyczka na Bloglovin Introwertyczka na Google+ Introwertyczka na Google+ Introwertyczka na Pingerze Introwertyczka na Filmwebie Forum dla Ciebie Introwertyczka na Disqusie Napisz do mnie Subskrybuj blog
Kopiowanie treści jest zabronione. Wszelkie prawa zastrzeżone.