Love this world: Címek formázása

2015. március 21., szombat

Címek formázása

Üdv!

Dorottya kérdezte a chatben, hogyan lehet olyan betűtípust beállítani, ami nem alapértelmezett a Blogspotnál. Nos, most be fogom mutatni, viszont erre nem magamtól jöttem rá, hanem találtam egy leírást, amit a Firerose című blogon olvastam. Gondolom, sokatoknak ismerős ez a név?! Tehát mielőtt bárki belekötne, ugyan most én fogom megfogalmazni a procedúrát, viszont nem magamtól jöttem rá és a forrás megjelölésről sem feledkezem el.

Most pedig nézzük is, hogyan kell úgymond "külső" betűtípust alkalmazni a blogunkon.

Nos, mivel maga a blogspot használathoz is szükséges egy gmail-os profil, ami mint tudjuk, a google-hez kapcsolódik, így szerintem senkit se fog meglepni, ha azt mondom, hogy az eddig még nem használt betűtípusokat a Google Fonts (katt!) nevű oldalon fogjuk megtalálni. Jelenleg 676 betű család található meg, amiből mi sajnos csak egy töredéket használhatunk, mivel sok készletben nincs ékezetes betű. Egy kis érdekességként szeretném megosztani veletek, hogy az alap betűtípusok között találtok egy olyat a blogspot-on, hogy Lobster, amit én rendszeresen alkalmazok az elmúlt időszakban, aminek elviekben van ékezetes betűje, azonban ha a blogspot-os készletből választom ki, akkor az ő betű más típusú lesz, ami elég zavaró tud lenni. Ennek ellenére itt is ezt láthatjátok, mivel ha a Google Fonts-ról használom kódként, akkor ezt a kis hibát ki is küszöbölöm, bár kicsit tovább tart így az eljárás, de esztétikailag szebb lesz az eredmény, és azért nem is több percről beszélünk. Főleg, ha már rutinosan használjuk a kódokat, vagy tudjuk, hogy akkor milyen betűt is akarunk.
Ha már az oldalon vagyunk, akkor neki is kezdhetünk a keresésnek. Most nem részletezném, hogyan tudunk szelektálni, de egy külön bejegyzésben ezt majd megteszem. Nos, a képen (a segítő képeket a bejegyzés alján találjátok meg) láthattok két bekeretezett részt. A felsőbe én a magánhangzókat szoktam beírni, természetesen bármi mást lehet, viszont így látni fogjuk, hogy melyik betűtípusnál vannak ékezetes magánhangzók és melyiknél nincsenek. Mint láthatjátok a betűtípusok téglalapokban vannak és így el is vannak egymástól választva. A jobb alsó sarokban lévő gombok közül kell azt kiválasztanotok, amit be is kereteztem nektek. Ez fog átvinni arra az oldalra, ahol betudjuk állítani, hogy az ékezetes betűkészlet kell nekünk, illetve magát a kódot is itt fogjuk megtalálni.
A következő lépés csak egy kattintás lesz. Az új oldalon is körbe vannak határolva az egyes részek, nekünk pedig a második kell először, ami meg is van számozva. Itt ki kell pipálni a Latin Extended (latin-ext) feliratot, amit be is karikáztam nektek a képen.
Ha ez meg van, akkor jöhet a következő blokk, a hármas. Ahogyan olvashatjátok is, ezt a kódot a weblaphoz kell hozzáadni. Ha ezt nem teszitek meg, de mondjuk a következő részt beírjátok a CSS-be, nem fog megjelenni a kívánt betűtípus. Ezt egy HTML dobozba kell bemásolni, ami lehet a chat doboza is, vagy egy kódos szövegdobozé, vagy egy teljesen újat is létrehozhattok, mivel nem fog megjelenni sehol se.
A négyes részből pedig a CSS kódba kell elhelyezni ezt a kódot. Ezt a Sablon szerkesztőnél, a Speciális fül alatt, a CSS hozzáadásánál tudjátok megtenni, ha jól emlékszem ezek a nevek. Nos, mivel Dorottya a bejegyzés címének formázására volt kíváncsi, így ezt fogom megmutatni, de természetesen ez használható az oldalsávban is, ami a dátumot is formázni fogja, illetve, ha bejegyzésen belül a Cím formátumot használod. Fontos, hogy az egészet másoljuk ki a Google Fonts-ról, mivel, ha már csak a pontos vessző lemarad, akkor nem lesz érvényes a kód. Nos, akkor íme a kód, amit az üres helyre kell bemásolni:

h3.post-title, .comments h4 {
text-align:center;
font-family: 'Open Sans', sans-serif;}

Nagyjából ennyi is lenne az egész. A méretet ott kell beállítani, ahol egyébként is kellene, ha alapértelmezett betűt használnál, de természetesen ezen a kódon belül is lehetne. Ha bármi gond lenne, vagy nem sikerülne, nyugodtan írjatok.