Grafika, Photoshop, tutoriály

Koho zajímá WordPress, tak už se určitě někdy setkal se šablonami, a také už si možná přečetl článek od JAA, jak takovou šablonu vyrobit. Já se ale dnes nebudu zabývat, jak vytvořit něco konkrétního. Řeč bude o anatomii šablony.

Úvod do šablon

Šablona je balíček PHP, HTML, CSS souborů a obrázků, který vám umožňuje změnit vzhled vašeho blogu. Samozřejmě je jasné, že každá šablona je jiná, některá méně, některá více. Když se však pořádně kouknete na jejich soubory, zjistíte, že je jich mnoho shodných. Ty, které najdete skoro v každém motivu, si můžete prohlédnout na obrázku.

Soubory header.php, footer.php a sidebar.php slouží k utvoření rozložení webu a jsou většinou na každé stránce. Proti tomu ostatní standardní soubory (kromě comments.php) slouží ke stylování jednotlivých částí webu. Seznam všech takovýchto souborů najdete na následujícím obrázku. Jinak další popis najdete samozřejmě v dokumentaci.

Jak jsou ale všechny tyto soubory propojené? To je velice jednoduché. Soubory typu header.php se připojují pomocí tzv. Include tags. To jsou PHP funkce, které na místo, kde je tato funkce napsaná, načtou zdrojový kód inclůdovaného souboru. Druhé typy souborů si načte WordPress sám. Pokud čtenář navštíví např. příspěvek, WP projede složku, a pokud nenalezne soubor single.php, zobrazí index.php. Dole si můžete prohlédnout Include tagy v akci, pomocí kterých se snadno k obsahové části webu připojila hlavička, postranní panel a patička.

Co tvoří soubory šablon?

Tak, nyní máme za sebou strukturu souborů šablony a je na čase se podívat co tvoří samotné soubory šablon. Každý soubor (kromě souborů s CSS styly) je tvořen z HTML, které utváří formátování, a z PHP, jenž zajišťuje dynamický obsah. Jak jsou tyto dva jazyky propojeny si můžete prohlédnout na následujícím obrázku (screen index(u).php z defaultní šablony).

Dalo by se řící, že HTML obklopuje jednotlivé funkce PHP. Samozřejmě každá funkce má za úkol něco jiného, ale daly by se rozdělit do tří tématických celků:

• Smyčka (The Loop)
• Šablonové tagy (Template tags)
• Podmínkové tagy (Conditional tags)

Smyčka

Smyčka (The Loop) je určitě nejdůležitější část šablony, protože zajišťuje výpis příspěvků, stránek,… Její podoba vypadá následovně:

Ve skutečnosti to je velice jednoduchý cyklus, který se spustí, pouze pokud je splněna podmínka „máme články“, jinak WordPress vyplivne text druhé větve, většinou nějaké hlášení ve smyslu: „V této sekci se nenalézají žádné příspěvky.“ Vnitřek cyklu tvoří Šablonové tagy, o kterých bude řeč později. Síla tohoto cyklu leží ale jinde a to u funkce query_posts(). Tento tag má nespočet využití v pokročilejším šablonování a sami uvidíte, že se bez něho při tvorbě nějakého trochu složitějšího vzhledu neobejdete. Můžete pomoci něho např. „vyhodit“ určité kategorie ze smyčky, nebo vypsat články podle určitého tagu, … využití je nespočet. Query_posts se umisťuje nad podmínku. Na konec smyčky (pod endif;) se dává ještě funkci wp_reset_query(). Ta neguje funkci query_posts.

Přehled parametrů najdete v dokumentaci – query_posts#Pa­rameters. Jen upozorním, že pokud tuto funkci použijete, nebude vám fungovat stránkování – na každé stránce bude stejný obsah. To se dá ale snadno opravit jednoduchým kódem. V prvním řádku získáme číslo stránky a poté už jen v parametru paged toto číslo zadáme.

Nyní si můžete prohlédnout, jak vypadá kompletní smyčka a její výsledek po nastylování.

Šablonové tagy

Šablonové tagy (Template tags) jsou PHP funkce, které jsou deklarovány v jádru WordPressu. Slouží k dynamickému výpisu informací např. zobrazení kategorií, názvu webu, názvu článků, … My už jsme se s jedním takovým tagem v tomto článku setkali – query_posts(). Seznam šablonových tagů najdete v kodexu.

Šablonové tagy se skládají ze dvou částí jako každá jiná volaná funkce – z názvu a z parametru. Pokud žádné nebo některé parametry nevyplníte, funkce použije parametry přednastavené. Na dolním obrázku se můžete kouknout, jak vypadá zápis tagu a na defaultní parametry funkce wp_list_categories.

Zajímavou novinkou se v nové verzi WordPressu (2,9) staly šablonové tagy ze škatulky Post Thumbnail tags. Umožňují jednoduché a rychlé připojení thumnbnailu k článku. Abyste je použili, stačí dva jednoduché kódy (viz obrázek). Dříve se to muselo dělat pomocí uživatelských polí, o kterých bude určitě řeč v některém z dalších dílu tohoto seriálu.

Podmínkové tagy

Podmínkové tagy (Conditional tags) mají také všestranné využití. Můžete díky nim změnit formátování jen určitým částem webu, např. určitým kategoriím, stránkám, … Jejich vyčerpávající přehled naleznete zde. Na příkladu si můžete prohlédnout použitou funkci is_category(), díky které se místo textu zobrazí v sekci Fotky obrázek. Tento blok kódu by se dal vložit např. do souboru index.php či archive.php do smyčky.

Nakonec si prohlédneme příklad použití podmínkových tagů. Tato ukázka je vzatá z defaultní šablony. Nadpis se změní podle toho, v jaké části webu se návštěvník nachází (kategorie, tag, autor, …).

Tak to by dnes stačilo k anatomii šablony. Příště se podíváme, jak konkrétně vytvořit určité části webu a některé šablonové tagy si dále specifikujeme.