Niestandardowe czcionki

Czasami piszesz notkę na blogu i masz w planach wyróżnić coś za pomocą nietypowej czcionki. Niestety niewiele czcionek w bloggerze posiada polskie znaki, więc zasadniczo nie ma w czym przebierać, prawda? Zazwyczaj są to najzwyklejsze, proste fonty typu Arial, czy też Times New Roman. Czy one spełniają nasze wymagania?
Kiedy piszemy post, artykuł, czy recenzję - tak, owszem, są proste i czytelne. Niestety problem przychodzi kiedy potrzebujemy wyróżnić coś bardziej dekoracyjną czcionką jak np. Parisienne, Kaushan Script, Open Sans Condensed. Wszystko jest piękne, ale co zrobić? Skąd wziąć czcionki? Jak je wstawić? I to są właśnie kluczowe pytania, na które znajdzie się odpowiedź! No więc zacznijmy od początku!

Zastanów się jakiego fonta potrzebujesz. Na pewno takiego, który będzie zawierał polskie znaki, tj. ąćęłńóśżź. Hmmm... powiedzmy, że piszemy zaproszenie na konkurs. Nie istotne dla kogo! Nie chcemy robić tego w gimpie czy innym programie graficznym, tylko estetycznie napisać w poście. Co będzie nam potrzebne? TYTUŁ! I na nim się właśnie skupimy.

Wchodzimy na Google Fonts.


Przenosimy się do okienka o nazwie PARAGRAPH i w wyszukiwarce Preview Text wpisujemy ciąg polskich zmiękczeń, albo np. słowo ŻÓŁĆ. Wyszukujemy czcionki która nas interesuje i zawiera polskie znaki.

Nie sugeruj się powyższym zdjęciem, wyszukałam fonta z polskimi znakami, aby było mi szybciej.

Kiedy znajdziemy fonta klikamy na Add to Collection. Jeżeli chcesz możesz zaznaczyć w ten sposób więcej czcionek, które same połączą się w spójną całość.


Następnie klikamy Use znajdujący się po prawej stronie.


Use przeniesie nas tutaj! Teraz musisz zjechać suwakiem nieco niżej i odszukać elementy nr 3 i 4.


Kiedy już je znajdziesz - skopiuj kod z kolumny nr 3.
< link href='http://fonts.googleapis.com/css?family=Courgette' rel='stylesheet' type='text/css' >
Musimy nieco zmodyfikować nasz kod, a mianowicie dodać ukośnik w jednym miejscu, o tutaj:
<link href='http://fonts.googleapis.com/css?family=Courgette' rel='stylesheet' type='text/css'/ >

Mając tak zmodyfikowany kod, wchodzimy w szablon HTML naszego bloga i szukamy sekcji <head>, która powinna znajdować się już na początku kodu. Zaraz pod <head> wklejamy nasz zmodyfikowany kod.


Następnie chcąc wyróżnić jakiś wyraz, bądź zdanie w naszym poście umieszczamy je w wersji HTML w kodzie: < span style='font-family: 'Courgette', cursive;' > Zaproszenie </span>

Kolorem niebieskim zaznaczony jest selektor, który zmienia nam wygląd czcionki. Kopiujemy go z kolumny nr 4, którą utworzyła nam strona z fontami. Natomiast kolorem czerwonym zaznaczony jest tekst, który ma być napisany niestandardową czcionką.



Możemy również zmieniać fonty innych elementów naszego bloga, np. Tytułu posta, daty, tytułu gadżetu. Wtedy wystarczy że wpiszecie właściwość font-family: nazwa czcionki; w danym selektorze, tj:

#Followers1 {font-family: 'Courgette', cursive;}

Brak komentarzy:

Prześlij komentarz