Jste tu poprvé? - Skrýt (musíte být přihlášeni)

Základy WordPressu 3 – Seznámení s šablonami

15. 4. 2010 v 0:00 1 Základy WordPressu 3 – Seznámení s šablonami

V minulém díle jsme se koukli na základy PHP, nyní se podíváme na PHP, které používá WordPress k výpisu dat.

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.

Obvykle používané soubory

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.

Template Hierarchy

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.

Include tags

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).

Screen souboru index.php

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

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ě:

Smyčka

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.

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.

query_posts() - fix

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

Kompletní smyčka

Š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.

Šablonové tagy Samozřejmě se nemá cenu učit všechny tagy nazpaměť, ale zas je dobré se naučit ty základní. Doporučuji vám zapamatovat si Include Tags, bloginfo, wp_list_categories, wp_list_pages, Post tags a query_posts.

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.

Šablonové tagy - The Post Thumbnail

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.

Podmínkové tagy

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, …).

Podmínkové tagy použití

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.

Zdrojový soubor : Není k dispozici

Komentáře k článku

Nejste přihlášeni - před odesláním příspěvku vyplňte protispamovou kontrolu níže - váš komentář bude viditelný až po schválení správcem. Pro okamžité schválení se přihlašte, nebo registrujte. Registrace nezabere déle než minutu.

  • :-D
  • 8-|
  • :-/
  • 8-)
  • :-(
  • :-O
  • =(
  • =D
  • :-)
  • <3
  • ;-)

* Povinné položky

  • #1
  • Asbe
  • 20. February 2011 | 22:57
  • Skupina: Registrovaní Uživatelé

moc fajn články, jen tak dál ;) opravdu dobrá práce, byl jsem laik - a stále jsem, ale rozhodně už chápu řadu věcí :) chci si upravit šablonu na stránkách, takže s netrpělivostí čekám na další články <3

Nahoru

Autoři: Jakub Houdek, Jakub Šimůnek, Petr Široký a příležitostní sebevrazi