Sablon személyre szabás használata


Probléma

Bár a tartalom a lényeg, mégis a blog kinézete az első, amivel az ember találkozik. Mindenki szeretne egyedi lenni, viszont a Blogger által kínált korlátozott számú sablon erre nem ad lehetőséget. Mit tehetünk hát, hogy kicsit személyesebbé tegyük a blogunkat?

Megoldás menete

Több megoldás is van, hozzáértéstől függően akármelyik jó lehet. A legegyszerűbb egy teljes sablon letöltése és használata. Ha ilyen nincs, még mindig használhatjuk a Blogger saját Személyre szabás menüjét, aminek a működését most részletesebben is megvizsgáljuk. Kisebb korrekciók esetén akár a HTML-kódba is belenyúlhatunk, de ez hozzáértést igényel, hagyjuk egyelőre. A teljes megoldás persze egy személyre szabható, kész sablon írása, akár egy új dinamikus nézet elkészítése, viszont ott még nem tartunk.

Megoldás

Először a Sablon menüben nézzünk kicsit körül! Itt látható egy előnézeti kép az asztali és a mobil verzióról. Ha ez első látásra megfelelő, nincs miről beszélni, készen vagyunk. Azonban valószínű, hogy nem ez a helyzet.
Alatta találhatóak a különféle beépített sablonok és azokhoz tartozó színváltozatok. Ha valamelyik szimpatikus, alkalmazzuk a blogra. Az előnézet azonnal megváltozik, de ha a nagy kép érdekel, nézzük meg magát a blogot. Lehetőségünk van sablontervezővel nem változtatható sablont alkalmazni a blogon, ehhez kattintsunk a Visszatérés a klasszikus sablonokhoz pontra. Bármikor válthatunk valami másra, ha nem tetszik.
Mivel sok, a neten elérhető sablon meglehetősen régi keltezésű, ezért ezek többsége klasszikus sablonokra épül, így azok alkalmazásához mindenképpen használnunk kell ezt a technikát!
Ha újabb sablont töltöttünk le, vagy mi magunk akarjuk személyre szabni a blog megjelenését, először érdemes egy biztonsági mentést készíteni. Ha egyszer valami megváltoztattunk, ritkán van lehetőségünk azt visszavonni, így a mentések szerepe óriási. Nem győzöm hangsúlyozni: egyetlen elütés is képes az egész blogot tönkretenni, de ha van a gépen egy fájl a korábbi sablonról, mindössze két kattintás, és minden újra a régi. Ehhez kattintsunk a Sablon nézet Biztonsági mentés/Visszaállítás gombjára, majd attól függően, hogy le vagy fel szeretnénk tölteni a sablonfájlt, használjuk a megfelelő gombokat.
sablon biztonsági mentés beállítása
Sablon le- és feltöltése
Ahogy a Blogger is mondja, minden komolyabb változtatás előtt érdemes egy mentést csinálni. Sosem tudhatja az ember...
Ha kiválasztottuk a nekünk tetsző alap sablont, a Személyre szabás gombra kattintva elkezdhetjük... nos... személyre szabni. A menük magukért beszélnek, plusz ha eltévednénk, van egy élő előnézet, amivel azonnal látszik minden változtatás. (Már ami érinti a blogot. Ha az oldalak színét változtatjuk, de nincsenek oldalak, nem látunk semmit.) Ugyanitt megválaszthatjuk az alap sablont is, a blog moduljainak elrendezését, a blog szélességét, a háttérnek beállíthatunk egy képet – szinte mindenre van lehetőségünk.
A Speciális menü utolsó pontja, a Stíluslap (CSS) hozzáadása, érdemel még pár szót. Ez egy haladó beállítási lehetőség, ha valaki ért a CSS-hez, ezen keresztül megváltoztathatja a különféle elemek kinézetét. Fontos azonban, hogy ez nem írja felül a már létező stíluslap értékeket! Mindössze a végére hozzáfűzi az általunk begépelt kódot. A CSS alapozásban majd látjuk, hogy ez mit jelent az elem kinézetére vonatkoztatva, most legyen elég annyi, hogy ez nem feltétlenül jelent valódi változást.

Ha elégedettek vagyunk a kinézettel, a következő lépés a blogon található elemek elrendezése. Talán nem vagyunk teljesen elégedettek a jelenlegi formával, vagy újabb modulokra lenne szükségünk: az Elrendezés menü lesz a mi barátunk. A Személyre szabáson belül beállítjuk a blog nagyobb szekcióinak elrendezését (hány oldalpanel legyen, milyen láblécet szeretnénk stb.), majd az egyes modulokat a helyükre húzzuk az Elrendezésben. A Szerkesztés gombokra kattintva további testreszabási lehetőségeink vannak. Talán az egyik legfontosabb, hogy a fejléc képét is itt adhatjuk meg, a Header (Oldalfejléc modul) menüben. A blogbejegyzések kinézetét is szerkeszthetjük, mint erről már volt szó. Ha valakit idegesít a felső navigációs csík, akkor a Navbar modult kell a "Ki" kapcsolóra állítani, máris eltűnik. Illetve nem teljesen, bármely újabb sablon-változtatásnál örömmel jön vissza. Ilyenkor újra és újra kikapcsolhatjuk. (Vagy a HTML-kódból mindenestül töröljük.)
A különféle paneleknél lehetőségünk van újabb modulok hozzáadására.
modulok hozzáadása
Modulok hozzáadása az Elrendezés menüben
Nem mennék bele a részletekbe, melyik modul mit tud, akit érdekel, nézzen körül nyugodtan. Egyet mégis bekereteztem, mert ezt fogjuk sokat használni, és külső modulok hozzáadásánál is ez játssza a legnagyobb szerepet: a HTML/JavaScript modulról beszélek. Ahogy a neve is mondja, ide HTML vagy JavaScript kódokat lehet beszúrni.

Szót kell még ejtenem a Dinamikus nézetekről. Szintén a Sablon menüben érhetőek el, és egészen másképp viselkednek, mint a többi sablon, legyen az klasszikus vagy személyre szabható. Egyrészt a felhasználó tudja állítani, így ha nincs megelégedve azzal, amit mi választottunk, nyugodtan válthat egy másik nézetre, másrészt csak nyilvánossá tett blogok esetében elérhetőek. Ennek is meg van a maga magyarázata (AJAX hívásokra épül, ami a feedből dolgoznak – gondolom, ez nem sokat mondott), később, ha eljutunk odáig, részletesen is foglalkozunk vele. Sőt, az egyik cél az, hogy képesek legyünk egy saját dinamikus nézetet összerakni. Egyelőre elég annyi, hogy ezek is személyre szabhatóak a Blogger megfelelő menüjében, de ha a HTML-kódban próbálunk turkálni, hát kellemetlen perceknek nézünk elébe. Ezeket a sablonokat nem lehet a klasszikus HTML/CSS szerkesztéssel testreszabni! Nem baj, a JavaScript majd segít rajtunk. Személy szerint nem kedvelem ezt a funkciót, mivel a sok JS-hívás lassítja az oldalt, régebbi böngészők beragadhatnak tőle, kisebb teljesítményű gépeken meg egyenesen horror, de egy mai középkategóriás számítógépnek röhögve el kell bírnia az ilyenekkel. Nagyon jó funkció hobbi-blogokhoz, de az összes megjelenítés erősen épít a képekre, így ha a közzétett bejegyzésekben nincsenek ilyenek (például blogregény esetében), nem javaslom. Ha érdekel, hogy nézne ki vele a blogod: a blog címe mögé írd be, hogy /view/classic, ennek segítségével a blog sablonjának átállítása nélkül láthatod az eredményt. Tehát az én blogom esetében ez így nézne ki:

http://igyneveldablogodat.blogspot.hu/view/classic

Itt pedig a további elrendezéseket is megtekintheted. Nem csak saját blogon működik, bárhol! Válassz ki egy blogot, és próbáld ki ott is. Akár az enyémen. Ahol mindjárt észreveszel egy furcsaságot, mégpedig a képekkel kapcsolatban. Az első bejegyzésnek nincs képe, holott a mostani megjelenítésnél van. Apróság, a dinamikus nézetekhez más HTML-kódlap tartozik, mint a jelenlegihez, márpedig az olyan bejegyzéseknél, ahol nincs kép, beállítottam egy alapértelmezett fotót, amit megjeleníthet. Ez a hátránya a "beégetett" (hard coded) kódoknak. Ha egyszer átállok egy dinamikus sablonra, majd ott is megváltoztatom.

Összefoglalás

Ebben a cikkben szó volt a blogok személyre szabásáról: akár kész sablon letöltéséről, akár a Blogger által felajánlott sablonok megfelelő menüben történő személyre szabásáról. Megnéztük az Elrendezés menüt, a modulok szerkesztését, illetve betekintést nyertünk a Blogger dinamikus nézetek sablonjaiba is. Már majdnem mindent tudunk egy csodás blogregény sablon összehozásához, már csak egy téma van hátra: az egyéni átirányítások kezelése.

Megjegyzések