A webes tartalomkezelő rendszerek sajátossága, hogy különválasztják a tartalmat és az arculattervet, hogy a weblap tulajdonosa vagy nagyobb portálok esetén a szerzők weboldal-szerkesztési ismeretek nélkül készíthessenek cikkeket, a webtervezők pedig profi dizájnokat tervezhessenek. A Joomla! híres a szebbnél szebb websablonokról. Ha több ilyen sablont telepítünk, akkor weblapunk arculatának átváltoztatása pillanatok műve.
Igazság szerint azonban ez nem egészen így van, mert a sablonokban az oldal megjelenítése a tartalmak és a blokkok (Joomla! szakzsargonnal élve: modulok) elrendezésétől függ. Az is előfordulhat, hogy amit és ahogy látunk az egyik sablon használatakor, azt nem látjuk vagy nem úgy látjuk egy másik sablonra átváltáskor.
Az asztali programok (és egyes CMS-ek) a "téma" terminust használják a dizájnra. A Joomla-sablonok fejlesztését egyes tervezők már olyan magas fokon űzik, hogy egy sablonhoz tucatnyi témát is kidolgoznak, és nekünk, felhasználóknak csak ki kell választanunk a legmegfelelőbbet a sablon beállításaiban. Mivel egy CMS-nek van csak a kivételezettek számára látható adminisztrációs kezelőfelülete (back-end), és van felhasználói oldala (front-end), külön-külön sablonra van szükség mindkét felülethez.
A Joomla! 1.5 csomag alapból tartalmaz egy back-end sablont, illetve kapunk három sablont a felhasználói oldal megjelenítéséhez. Ezek közül hadd emeljem ki a Beez sablont, mely valószínűleg nem fog tetszeni első pillantásra, viszont jó kiindulópont lehet egy CSS-alapú, akadálymentes weblap tervezéséhez. A funkciókban gazdag JA Purity sablont a vietnami (!) JoomlArt tervezte a Joomla! Projekt által 2007-ben meghirdetett Joomla! 1.5 sablonversenyre és azért került be később a disztribúcióba, mert a közönségtől a legtöbb szavazatot elnyert JA Purity vitte el a fődíjat.
Ha nem tetszenek ezek a sablonok, három út áll előttünk: vagy megalkotjuk saját művünket, vagy böngészünk a kínálatból, illetve – több tízezer forintért – egy profi szolgáltatóra bízzuk elképzelésünk megvalósítását.
Saját kreáció
A sablontervezés látszatra könnyűnek tűnik, holott nem is olyan egyszerű. A dolgot az bonyolítja, hogy a webböngészők és azok verziói nem tartják be pontosan a vonatkozó szabványok előírásait. Ezért fordulhat elő az, hogy ami jónak tűnik például Firefoxban, másképp jelenik meg Internet Explorerben. És nem szabad megfeledkezni az ablakokon túli világról sem, hisz a weblapunkat felkereshetik Linuxon vagy Mac-en futó böngészőkkel is.
Nem árt, ha rendelkezünk PHP- és HTML-ismeretekkel, és jártasak vagyunk a CSS-ben, s jó, ha angolul is tudunk, ugyanis bőséges angol nyelvű szakirodalom lelhető fel e témában az interneten. A Joomla! dokumentációban is hozzáférhető egy oktatóanyag, melynek követésével elkészíthetünk egy alapszintű sablont. Aki több tudásra szomjazik, megvásárolhatja a Packt kiadó által tavaly kiadott "Joomla! 1.5 Template Design" című könyvet.
A Joomla! a /templates könyvtár alatt a sablon könyvtárában és annak alkönyvtáraiban tárolja a szükséges fájlokat. A /css mappába tegyük a stíluslapo(ka)t, a képeket-grafikákat a sablonhoz tartozó /images mappába töltsük fel. A sablon nevét viselő könyvtárban van a helye három nélkülözhetetlen fájlnak:
- index.php: ez az alapja minden, a Joomla! által szállított oldalnak. Lényegében egy oldalt készítünk (mint valamilyen HTML-oldalt), de PHP-kódot teszünk oda, ahova a tartalomnak kerülnie kell.
- component.php: ő jeleníti meg előugró ablakban az adott komponens által létrehozott oldalak nyomtatóbarát változatait.
- templateDetails.xml: a sablonnal kapcsolatos adatokat tárolja, mint például a fájlok és modulpozíciók – szóval nélkülözhetetlen állomány, nélküle nem látja a Joomla! a sablont.
A sablon fájljait a könyvtárszerkezettel tömörítsük .zip vagy tar.gz formátumú archívumba a terjesztéséhez. A végfelhasználók ezt a csomagot a Bővítménykezelő képernyőn könnyen tudják telepíteni.
A Joomla! 1.5 széles körűen használja az MVC (Model-View-Controller, magyarul: Modell-Nézet-Vezérlő) tervezési mintát, melynek csehovi tömörséggel összefoglalva az a lényege, hogy a rendszer alapkódjába való belenyúlás nélkül tudunk változtatásokat alkalmazni. Ez óriási erőt és rugalmasságot ad a webdizájnereknek, ugyanis nem kell törődniük az alapkóddal, nyugodtan koncentrálhatnak új dizájnok tervezésére. Ha például az alaprendszerétől eltérő elrendezésben kívánjuk megjeleníteni a tartalmat, akkor a sablon alatti mappában hozzuk létre a /html almappát, benne annak az érintett bővítménynek az almappáját (pl. /com_contact), melynek elrendezését a saját ízlésünkhöz akarjuk igazítani, s abba tegyük a bővítmény módosított .php fájljait.
A Grammy-díjas Gloria Estefan hivatalos weblapja látogatóinak Joomla szolgáltatja az oldalakat
Más tollával...
A Joomlával ismerkedőket a közösség egyik tagja által üzemeltetett bestofjoomla.com weblapra invitáljuk, mely tartomány a sablonterjesztés paradicsoma. A sablontervezők közzéteszik itt a munkáikat, alapértelmezett Joomla-telepítéssel tesztelhetjük őket, az ingyeneseket azonnal le is tölthetjük. A látogatók tetszésnyilvánításai, a letöltések száma és egyéb feltételek alapján közzétett toplisták segíthetnek a választásban. Az összetett szűrőrendszerrel közelebb juthatunk az általunk hőn óhajtott sablon megleléséhez.
Becslések szerint a világhálón üzemeltetett weblapok cirka 2,5 %-a fut Joomlán. A többmilliós felhasználói körnek köszönhetően a Joomla!-sablonok tervezése jól jövedelmező biznisz, mintegy 3 tucat szolgáltató osztozik a piacon. Némelyikük 30-50 dollárért darabonként árulja a portékáját, mások sablonklubokat alapítottak, melyeknek tagjai a tagság időtartamától (3-6-12 hónap) függően hozzájuthatnak az addigi összes sablonhoz és a tagság alatt kiadottakhoz egyaránt. A sikeresebbek, mint a RocketTheme, a JoomlArt vagy a YouJoomla időnként előrukkolnak modulpozíciókban bővelkedő, viszont szerényebb kivitelű, ám minőségi, ingyenes sablonokkal.
Kész Joomla-sablonok átszínezésével, átrendezésével, egyszóval testreszabásával mi is megpróbálkozhatunk, amennyiben a sablon licence erre engedélyt ad. Soha ne az eredeti sablon fájljait módosítsuk, hanem készítsünk másolatot. Első lépésként hozzunk létre egy új alkönyvtárat a /templates könyvtárban, majd másoljuk ebbe az alkönyvtárba az alapértelmezett sablont, ezt követően javítsuk a templateDetails.xml fájl adatait.
A sablonok telepítése, konfigurálása és kezelése
A sablonokat a kiszolgáló oldalra bejelentkezés után, a Bővítmények menü Telepítés/Eltávolítás menüpontjából megnyitható Bővítménykezelő képernyőn telepíthetjük. Megadhatjuk a helyi gépünkön lévő csomagfájlt, vagy ha a kiszolgálónk támogatja, az URL-cím bemásolásával telepíthetünk egy távoli kiszolgálón hozzáférhető sabloncsomagot. A telepítés óriási kényelmet biztosít a felhasználóknak, mert nem kell bíbelődniük a könyvtárszerkezet kézi kialakításával, a fájlok FTP-n való manuális feltöltésével.
A telepített sablonokat ugyancsak a Bővítmények menüben, a Sablonkezelő menüpont választásával megnyíló képernyőn tekinthetjük meg. Alapértelmezésként a felhasználói oldal sablonjainak listáját kapjuk. Az Adminisztráció hivatkozás követésével tekinthetjük meg a kiszolgáló oldal sablonjainak listáját. Amint áthaladunk az egérrel a sablonok nevein, buborékban felbukkanó képecskék segítenek a választásban. Az ember azt hihetné, ezeket a miniatűröket akkor generálja a Joomla!, pedig csak a sablon telepítőkészlete tartalmazza.
Ha a jelenlegi helyett egy másik sablonra kívánunk átváltani, válasszuk ki a sablont, majd az eszköztáron kattintsunk az Alapértelmezett gombra. A táblázat Alapértelmezett oszlopában a kis sárga csillag a mi sablonunkhoz fog vándorolni. Ha még nem nyitottuk meg böngészőnkben a weblap felhasználói oldalát, a menüsor jobb oldalán lévő részben kattintsunk az Előnézet gombra.
A kiszolgáló oldalra visszaváltva vagy a sablonnév hivatkozásának követésével, vagy az eszköztáron a Módosítás gombra kattintva nyithatjuk meg azt a képernyőt, ahol testreszabhatjuk a sablon beállításait. A Paraméterek rész sablononként változó, a fejlesztő által a sablonba épített opciókat állíthatjuk be. A JA Purity sablon esetében többek közt megadhatjuk a sablon szélességét, a navigációhoz használandó menütípust, vagy kiválaszthatjuk a fejléc és a háttér témáját.
Az eszköztáron elhelyezett HTML-szerkesztő gombra kattintva közvetlenül a kiszolgálón megnyithatjuk a sablon index.php fájlját, hogy könnyen javíthassuk az esetleges hibákat vagy módosításokat hajtsunk végre.
Látunk egy CSS-szerkesztő feliratú gombot is az eszköztáron. Megnyomása után a Joomla! kilistázza a sablonhoz tartozó összes stíluslapfájlt. Válasszuk ki a szükségest, majd kattintsunk a Módosítás gombra. A fentebb említett HTML-szerkesztési funkcióhoz hasonlóan megnyílik szerkesztésre az adott CSS-fájl, hogy igazítsunk a szöveg stílusán, vagy kicseréljük a színeket.
Hogyan lehetne megtudni, hogy a sablon milyen modulpozíciókat támogat? A sablon beállításait módosító képernyőn kattintsunk az Előnézet gombra. A Sablonkezelőben be fog töltődni a sablon, melyen megjelöltek lesznek a felhasználható pozíciók. Ez egy rendkívül hasznos szolgáltatás: új modul telepítése esetén megkönnyíti a modul pozíciójának meghatározását. Ehhez nyissuk meg a Bővítmények menüből a Modulkezelőt, s nyissuk meg az óhajtott modul beállítás-módosító képernyőjét. A Részletek részben, a Beosztás legördülő listában választhatjuk ki a modulpozíciót. (Sajnos e vezérlő megnevezésének a fordítása félreérthető, mert ugyanezt az eredeti "Position" szót a kezelőfelület más helyén is felhasználják.)
Meg lehet-e tudni, hogy melyik modulokat rendeltük hozzá a sablon valamely modulpozíciójához? A már említett Modulkezelőben találjuk a "- Válasszon pozíciót -" legördülő listát. Ebben válasszuk ki az egyik elemet, és a Joomla! már szűkíti is a listát a modulpozícióhoz tartozó modulokra.
Van-e lehetőség új modulpozíció hozzáadására? A Joomla! 1.0-hoz képest a Joomla! 1.5-ben ez sokkal egyszerűbb lett. A Joomla! 1.0-ban max. 50 pozíciónak volt hely, a Joomla! 1.5-ben korlátlanra nőtt a számuk. Az új pozíció hozzáadására az előző sorozatban egy speciális képernyőn volt lehetőség, a Joomla! 1.5-ben a modul beállításmódosító képernyőjén, a Beosztás mezőbe írhatjuk be a pozíció nevét, s rendelhetjük máris hozzá a modulhoz. Mentés után hiába keressük a felhasználói oldalon a modulunkat az új pozícióban; akkor lesz csak látható, ha kiegészítjük vele a sablon kódját is.
A modulpozíciókat nem csak az adminisztrációban tekinthetjük meg, hanem egy apró trükkel a felhasználói oldalon is: a webcím után írjuk be a "?tp=1" paramétert, például:
http://www.sajatweblap.hu/?tp=1
Ne lepődjünk meg, ha a teszt weblapon nem működik ez a trükk, ugyanis nagy valószínűséggel letiltották, mert erre is van lehetőség.
A statikus oldalakból álló webhelyekhez hasonlóan a Joomlával is megoldható az, hogy egyes oldalaknak eltérő elrendezése és dizájnja legyen. Ehhez telepítsünk egy új sablont, majd nyissuk meg a módosító képernyőjét. A Hozzárendelés menüpontokhoz részben a Menük sornál jelöljük be a Válasszon a listából lehetőséget. Ennek hatására aktiválódni fognak az alatta lévő mezőben lévő menüpontok, s kiválaszthatjuk azokat, melyekhez hozzá kívánjuk rendelni a sablont. Mentés után a váltsunk át a felhasználói oldalra. A vonatkozó menüponthoz tartozó oldalak a kiválasztott sablonnal fognak megjelenni.
A fölöslegessé vált sablonokat könnyűszerrel távolíthatjuk el a Bővítménykezelőben. Kattintsunk a Sablonok hivatkozásra, jelöljük be a törölni kívánt sablont, majd az eszköztáron nyomjuk meg az Eltávolítás gombot. Az épp használt sablont nem engedi eltávolítani Joomla; ezt arról ismerhetjük meg a táblázatban, hogy szürke a színe, s ki sem lehet pipálni a jelölőnégyzetét.
A Joomla! 1.5 sablonoknak (az adminisztrációs felülethez és a webhelyhez egyaránt) végre saját nyelvi fájljaik vannak. Ez óriási előrelépés a többnyelvű weblapok építésében és jól tükrözi a Joomla! Projekt internacionalizálási (i18n) törekvéseit. A Joomla! 1.0-ban ezek a szövegek hardcode-oltak voltak, és például egy angol-magyar nyelvű weblap esetén angolul maradtak. A Joomla! 1.5 sablonok a jobbról balra írásirányú nyelvek (pl. arab, héber) használatát is maximálisan támogatják.
A magukra valamit is adó sablontervezők felismerték azt az igényt, hogy sablonjaikat a legnépszerűbb Joomla-komponensek támogatására is felkészítsék. Eleinte egy-egy sikeres bővítményre (pl. VirtueMart, Community Builder, RSGallery) szabott sablonokat adtak ki, ma már nem maradhat el sablon a K2, a JomSocial, a JComments és még jó néhány bővítmény támogatása nélkül.
Keretrendszerek
A Joomla! sokkal több, mint egy tartalomkezelő rendszer: háromszintű keretrendszer is egyben, melynek legfelső, Bővítmény rétege tartalmazza a bővítményeket, köztük a sablonokat. Ez arra inspirált egyes sablonfejlesztőket, hogy kidolgozzák saját sablonkeretrendszereiket, ami eszméletlenül felgyorsítja rugalmas és hatékony dizájnok tervezését. Közös bennük, hogy a kiszolgáló oldalon konfigurálható, többféle elrendezési lehetőséget támogatnak, többféle menütípus közül választhatunk, keresőbarát sablonokat tervezhetünk velük, s nem utolsó sorban támogatják a webes tartalom mobileszközökön való megjelenítését. A legtöbb ilyen keretrendszer ma már a GNU GPL licenc alatt szabadon hozzáférhető, hogy az alapsablonból kiindulva megtervezhessük álmunk sablonját. A RocketTheme Gantry névre keresztelt keretrendszerét Joomla-komponensként telepíthetjük, a JoomlArt beépülő modulként terjeszti a T3 keretrendszert.
***
Ott motoszkálhat az olvasóban a kérdés, hogy nem okoz-e ugyanazoknak a sablonoknak a különféle webhelyeken való ismétlődése falanszter-érzést a felhasználókban? A gazdag színvilág, az eredeti ötletek és a saját tartalom feledtetik ezt weblapunk látogatóival.
Joomla!Nap 2010
Helyszín: CEU Konferenciaközpont, Budapest
Időpont: 2010. október 9.
Regisztráció és a részletes program: Joomla!Nap 2010
