2. lecke: Témák (sablonok)

Back to: 3. kurzus: A weboldal testreszabása

A lecke után képes leszel:

-megérteni mi az WordPress-téma, az-az egy sablon, és mit jelent ez a weboldaladnak?
-megtalálni az előre telepített témákat és harmadik féltől származó témákat is
-megérteni majd, hogy mit kell figyelembe venned a téma kiválasztásakor. Mire is akarod használni a weboldaladat?
-hogyan is kell telepíteni és aktiválni a WordPress sablonokat?

1.Mire is való egy WordPress sablon?

Ebben a modulban végig vezetlek a weboldalad testre szabási folyamatán. Az előző leckében
megtanultuk a WordPress által kínált beállításokat. Itt az ideje, hogy megnézzük a WordPress
témáit, az-az sablonjait. Ezért ebben a leckében azzal kezdek, hogy elmagyarázom, mi az téma, és mit érdemes figyelembe venni a téma kiválasztásakor?

A sablon kezeli a WordPress weboldalad megjelenését, kinézetét. A Te vállalkozásod, céged, blogod márkájának reprezentációjaként szolgál, ugyanakkor gondoskodik a WordPress tartalmának és adatainak, például az oldalak és a bejegyzések vizuális megjelenítéséről. Egyszerűen fogalmazva: egy sablon azt nyújtja, amit az emberek látni fognak az Interneten, amikor megtalálják a keresőkben a
weboldaladat.

2.Hol találhatsz WordPress weboldal témákat (sablonokat)?

A WordPress telepítéskor előre telepített témákat is feltelepít, amiből választhatsz. Valószínű, hogy ezek közül a témák közül egyik sem fog tetszeni Neked, vagy,  nem felel meg a Te egyedi igényeidnek. (remélhetőleg, ha tudod egyáltalán mire is van szükséged). A WordPress legnagyobb előnye és szépsége, hogy hatalmas közösséggel rendelkezik, ami azt jelenti, hogy rengeteg ingyenes sablon létezik, amihez még hozzáadódik a harmadik féltől származó témái is. Én is fejlesztek egyedi témákat és publikálom azokat. Mind fizetős, mind ingyenes változatok elérhetőek.

Ha tovább akarsz kutatni az előre telepített témák kínálatán kívül, akkor a WordPress témakönyvtárban lehet keresgélni.

Az itt található összes témát a WordPress csapata felülvizsgálja és jóváhagyja, hogy biztosítsa azok minőségét. Ehhez a témakönyvtárhoz közvetlenül is hozzáférhetsz, ha bejelentkezel a weboldalad WordPress vezérlőpultjába, és elnavigálsz a Megjelenés>Sablonok> Új hozzáadása gombra kattintva. Innen még könnyebb letölteni és telepíteni a sablont hiszen közvetlenül a saját weboldalad vezérlőpultjából végzed a folyamatot.

A WordPress minden évben létrehoz egy új alapértelmezett sablont. Ez a

Twenty Twenty WordPress sablon

A 2020-as alapértelmezett témát úgy alakították ki, hogy teljes mértékben kihasználjuk a blokkszerkesztő rugalmasságát.  A szervezetek és vállalkozások képesek dinamikus céloldalakat létrehozni végtelen elrendezéssel a csoport- és oszlopblokkok segítségével. A központosított tartalom oszlop és a finomhangolt tipográfia a hagyományos blogok számára is tökéletes. A teljes szerkesztőstílusok jó képet adnak arról, hogy milyen lesz a tartalmad, még a közzététel előtt. Személyre szabhatod weboldaladat a háttérszín és a fontos színek megváltoztatásával a „testreszabóban”, az-az a sablon „Testreszabás” gombra kattintva (amit módosítasz, már látszik is opcióval). A weboldal minden elemének színe automatikusan kiszámításra kerül a kiválasztott színek alapján, magas, hozzáférhető színkontrasztot biztosítva a weboldal látogatód számára.

3. Hogyan válasszunk sablont?

A témaválasztás egyik legnehezebb döntésed lesz a rendelkezésre álló több ezer téma miatt 🙂 De a létrehozása célja a Te döntésed lesz. Szűrőként alkalmazd a lehetőségek leszűkítésére. Mert a fától nem  fogod látni az erdőt…vagy fordítva 🙂 ?

Például a WordPress témakönyvtár  ezeket szűrők kínálja:

Ha új sablont szeretnél hozzáadni, kattints a „jellemző szűrő” gombra. Ezután a szűrők három különböző
kategóriája oszlanak:

• Tárgy: ( pl. webhelye blog, híroldal vagy e-kereskedelmi weboldalt szeretnél?)
• Jellemzők: ( pl. azt akarod, hogy a weboldaladon legyen egyéni fejléc, azt szeretnéd, hogy
  widgetek legyenek a láblécében?)
• Elrendezés: ( pl. azt akarod, hogy a weboldalad legalább két oszloppal rendelkezzen, szeretnél
  oldalsávot?)

Azon a tényen kívül, hogy egy témának illeszkednie kell a weboldalad céljához, a téma kiválasztásakor más szempontokat is figyelembe kell venned!

1. Támogatás

Először is, a WordPress-szel kapcsolatos tapasztalataidtól függően célszerű olyan témát
választanod, amely támogatást nyújt számodra, ha valahol elakadsz. Így segítséget kaphatsz a sablon beállításához vagy testre szabásához. Ne feledd, hogy nem minden témához nyújtanak támogatást (fejlesztői segítséget). Sőt, aki ad támogatást, még sokszor őt sem lehet elérni (pláne, ha nem beszélni inglis 🙂 )

2. Mobilra kész? (responsive a sablon?)

Egy másik dolog, amellyel tisztában kell lenned, hogy a sablonnal működő weboldalad mobileszközökön is működnie kell. Ez azt jelenti, hogy weboldalad egy tablet vagy okostelefon számára is megfelelően elérhető, még akkor is, ha egyik iOS, vagy Android oprendszerrel működik? A tesztelés legjobb módja, ha a témát aktiválod és saját magad ellenőrződ le a mobiltelefonodon. Próbáld meg megállapítani, hogy a mobil élmény kielégítő-e számodra.

3. Böngészők közötti kompatibilitás

Az utolsó dolog, amit meg szeretnék hangsúlyozni – és ez meglehetősen technikai jellegű -, hogy a
témának böngészőkkel kompatibilisnek kell lennie. Ez egy érdekes módja annak, hogy a
sablon megfelelően működik minden népszerű böngészőben, asztali és mobil eszközökön
egyaránt. Ennek oka az, hogy nem minden böngésző támogatja ugyanazt a webes technológiát.
Egy sablonfejlesztőnek ezt figyelembe kell vennie! De nem mind foglalkozik ezzel. Tehát mindenképpen próbáld ki saját magad, amikor létrehozod weboldaladat. Egyszerűen megnyitod a legnépszerűbb böngészőkben a weboldaladat és látod is, hogy működik a weboldalad vagy nem.

4.Témák telepítése

Ha más sablont szeretnél a weboldaladon, három dolgot tehetsz:

• Lehet aktiválni egy témát, amit már korábban telepítettél
• Lehet telepíteni egy új témát a WordPress témakönyvtárból
• Lehet telepítsen egy harmadik féltől származó témát .zip fájl feltöltésével

Másik téma aktiválása

Az aktivált téma az a téma, amelyet a látogatók is látni fognak, amikor a weboldaladra navigálnak. Ha
másik témát szeretnél használni (ha már korábban telepítetted persze) a weboldaladon, akkor megteheted ha az egérmutatót a Témák
áttekintésében található többi téma fölé helyezed. Ekkor megjelenik két opció.  A „bekapcsolás” és az „élő nézet” gombok Bekapcsolás: erre kattintva azonnal aktiválod ezt a témát a weboldaladon, amit
korábban említettem, ez – láthatóvá teszi a látogatók számára is. Lehet, hogy ebben a
szakaszban még nem ezt szeretnéd, hogy mások is lássák már az új kinézetet, amit még Te  sem  láttál :). Mindig tanácsos először bekapcsolás előtt tesztelni, hogyan is fog kinézni egy új sablonnal a weboldalad.

Élő előnézet: ezért javaslom, hogy először válaszd az ‘Élő előnézet’ lehetőséget. Ezzel eljuthatsz az úgynevezett „Testre-szabó” -hoz, a csodás Magyar kifejezéshez. Ha már női szabókról nem hallani, hm….a mai világban már weboldal testre-szabók lesznek 🙂 (amelyet a következő leckében tárgyalunk :)). Itt megnézheted és kipróbálhatod, hogyan fog kinézni weboldalad ezzel a rendelkezésre álló sablonnal úgy, hogy még nem kapcsoltad be , az-az nem publikus ez a „kinézet” vagy téma.

Új téma telepítése a WordPress könyvtárból

Ha új témát szeretnél telepíteni a WordPress könyvtárból, a Témák áttekintése tetején kattints a
Új hozzáadása gombra. (korábban már olvashattad. Ezt megtalálod a vezérlőpult-megjelenés-sablonok oldalon. Az ekkor megjelenő képernyőn áttekintést találsz a telepíthető és elérhető sablonokról. Használhatod a rendelkezésre álló szűrőket, vagy a képernyő jobb felső sarkában található keresőmező segítségével szűkítheted a választásodat.

Ha találtál egy tetszés szerinti sablont, két lehetőséged van:

• Telepítés: telepíts a sablont, hogy az megjelenjen a Sablonok áttekintésében. Ez nem azt jelenti, hogy automatikusan aktiválod is, de ettől a Témák áttekintésében kattinthatsz a ‘Telepítés’ gombra
• Előnézet: megtekintheted, hogyan fog kinézni ez a sablon a weboldaladon

Harmadik féltől származó téma telepítése

Ha egy sablont letöltöttél egy harmadik féltől, akkor feltöltheted a sablont úgy, hogy ismét kiválasztod az Új hozzáadása lehetőséget a Témák áttekintésében. A képernyő tetején lehetőség van egy sablon
feltöltésére (a „Téma feltöltése” gombra kattintva). Ezután lehetőség nyílik a téma .zip fájljának
feltöltésére. Kattintsa „Fájl kiválasztása”, majd a „Telepítés most” gombra. A sablon
telepítésre kerül és hozzáadódik a sablonok áttekintése oldalhoz. Ott aktiválhatod vagy megtekintheted az
előnézettel, ahogyan azt az előbb megtanultad már.

Csak haladóknak: Kezdőknek nem ajánlott

Gyermek sablonok (Child Themes)

Merüljünk el valamivel nehezebb dologban: gyermek sablonok. A gyermek sablon alapvetően egy
alsablon, amelynek szülősablonjának funkcióival, jellemzőivel és stílusával teljesen megegyezik. A szülő téma egy teljes sablon, beleértve az összes szükséges WordPress fájlt. Alapvetően minden sablon (a gyermek sablonok kivételével) szülő sablon.

De miért szeretnél gyerek sablont?

Mert a gyermek sablon lehetővé teszi a sablon módosítását és testreszabását anélkül, hogy 
aggódnod kellene, hogy rosszul csinálsz valamit :). Ily módon a testreszabások elkülönülnek az eredeti alap szülő sablontól. Ha közvetlenül módosítod a szülősablont, majd frissíted később ezt a sablont (mert a fejlesztő újabb frissítést adott ki vagy új WordPress jelent meg, amihez fejlesztik tovább a sablont, akkor valószínű, hogy az összes módosítás elveszik, ha upgradelsz 🙁 Na, ezért hozzunk létre a szülő témából gyermeksablont 🙂 Oké, ez egy kicsit nehéznek tűnik, tudom. Szerencsére nem mindig van szükség gyermek sablonra. A gyermek sablonra csak akkor van szükséged, ha módosítani szeretnéd a sablon témáit (kinézetét):

• PHP sablonok
• functions.php fájl
• a sablon mappában tárolt eszközök

Ha nem tervezel programozni (kódolni) kódokat hozzáadni ezekhez a dolgokhoz és csak módosítani szeretnéd a sablonodat a WordPress Irányítópulton keresztül, akkor jó, ha nincs gyermek sablonod. Ha módosítani akarod ezeket a fájlokat, szükséged lesz egy gyermek sablonra! Hogyan? Nézd meg ezt az információt a WordPress ezen oldalán . Néhány sablonnal automatikusan jár egy gyermek sablon is. Ellenőrizd a sablon részleteit, hogy ezt megtudd.

Kulcsfontosságú tudás, amit megkaptál ingyen:

• A WordPress sablon kezeli a WordPress webhelyed megjelenését. Ez az, amit egy személy látni fog,
  amikor ellátogat a weboldaladra
• A WordPress egy sor készletet tartalmaz előre telepített sablonokkal, de sok komolyabb sablon is van harmadik
  feleknél is. Sok sablont választhatsz, fizetett és ingyeneset is egyaránt
• A sablon kiválasztása előtt meg kell határoznod a céljaidat a webhelyednek. A sablonnak meg kell
  felelnie a webhely céljának
• A sablon kiválasztásakor azt is figyelembe kell venned, hogy szükséged van-e fejlesztői, programozási
  támogatásra, ha kell mobilra eszközökre optimalizált legyen, és ha az több böngészővel kompatibilis, akkor többen is fogják látogatni a weboldaladat!

Ha tetszett ez a lecke, akkor oszd meg másokkal is! Köszönöm! Bátran szólj hozzá és kérdezz! Mert az…

Információ kincs