Musilda.cz

Jak vytvořit vlastní šablonu pro WordPress – 1 díl

Musilda

V tomto článku bych chtěl začít se seriálem, v kterém si projdeme celým procesem tvorby šablony pro redakční systém WordPress. Na českém internetu lze nalézt několik článků, nebo seriálů, které tvorbu šablony popisují. Většinou však nejdou do větší hloubky, omezují se na stručný popis a složitější problémy je nutno řešit na anglicky psaných webech, nebo v Codexu WordPressu.

Budu se snažit napsat vše co si myslím, že je pro vytvoření šablony důležité a podstatné. Další věcí, díky které by měl být tento seriál odlišný od jiných, je, že pro vytvoření theme využijeme bootstrap a šablona tak bude responsivní. Takže vzhůru do nitra WordPressu.

Soubory důležité pro vytvoření šablony

Přestože se může zdát, že pro vytvoření šablony bude stačit několik souborů, většinou se dočtete, že stačí header.php, index.php, footer.php a style.css, tak pro vytvoření plnohodnotné a funkční šablony to stačit nebude.

Budeme potřebovat následující soubory:

Jak vidíte, celkem máme 15 souborů, aby jste pochopili, kdy a v jakém pořadí je WordPress zobrazuje, popíšeme si hierarchii šablony.

Template hierarchy – neboli hierarchie souborů v šabloně

Pokud načtete jakoukoliv webovou stránku, která funguje na WordPressu, systém postupuje následovně:

  1. Načte se soubor functions.php a provedou se, nebo zaregistrují funkce, pokud v souboru nějaké jsou.
  2. Zavolá se header.php, který obsahuje hlavičku stránky, tedy vše mezi tagy HEAD a horní část šablony, která se na na jednotlivých podstránkách opakuje, tedy logo, menu, možná nějaký slider
  3. Zavolá se soubor, v kterém je výpis obsahu stránky, může to být index.php, single.php, category.php, nebo page.php, zkrátka soubor obsahující obsah. Podle hierarchie šablony, určí WordPress, který soubor se zobrazí.
  4. Načte se footer.php, v kterém je patička webu.

Samotná hierarchie šablony určuje, kdy a za jakých podmínek se zobrazí který soubor. Pokud se jedná o výpis článků z kategorie, následuje po sobě header.php, category.php a footer.php. Protože header.php a footer.php se stále opakují, budeme se zabývat jen soubory zobrazující obsah stránky.

WordPress vždy hledá soubor, který patří k danému stavu a teprve poté, pokud jej nenajde, hledá další v pořadí a nakonec zobrazí index.php. V pořadí důležitosti jsou soubory řazeny podle relevance názvu.

Příklad:

Klikli jsme na odkaz na stránku kontakt. WordPress nejprve zjistí, že se jedná o stránku, tedy page a prohledá adresář, zda obsahuje soubor page-kontakt.php, pokud jej nenajde, hledá soubor page-idstranky.php (page-4.php například), pokud jej nenajde, vyhledá page.php a vypíše obsah dle této šablony. V případě, že nenajde ani page.php, zobrazí index.php.

Kdy se která šablona zobrazí

Mohou existovat následující možnosti:

Error 404 page

Stránka, na kterou chcete jít, neexistuje. Je tedy zobrazen soubor 404.php, kde by mělo být napsáno nějaké upozornění a uživateli nabídnuta další možnost. O tom, jak je důležitá stránka 404 pro uživatelskou přívětivost webu, je napsáno mnoho článků. Pokud 404.php neexistuje, zobrazí se index a info o tom, že nebyl nalezen žádný post.

Search result page

Pokud zadáte do vyhledávacího formuláře nějaký dotaz, hledá WordPress soubor search.php, kde vypíše obsah, který odpovídá dotazu. Pokud jej nenajde, zobrazí index.php.

 Archive page

Archívní stránka, je jakákoliv stránka s výpisem článků, kromě index.php. Po zjištění, že se jedná o archív, určuje WordPress o jaký jde.

Může jít o následující archívy a protože postup, jakým řadí systém soubory jasný, budu jej uvádět v číslovaném seznamu bez dalšího vysvětlování. Místo proměnných si dosaďte odpovídající názvy, například $taxonomy je název taxonomie, $slug je část url odpovídající postu.

Custom Taxonomy Archive

Archív vlastní taxonomie, nyní nepotřebujeme, uvádím pro úplnost.

  1. taxonomy-$taxonomy-$term.php
  2. taxonomy-$taxonomy.php
  3. taxonomy.php
  4. archive.php
  5. index.php

Category Archive

Výpis příspěvků v kategorii.

  1. category-$slug.php
  2. category-$id.php
  3. category.php
  4. archive.php
  5. index.php

Tag Archive

Výpis příspěvků obsahující vybraný tag.

  1. tag-$slug.php
  2. tag-$id.php
  3. tag.php
  4. archive.php
  5. index.php

Author Archive

Výpis příspěvků vybraného autora.

  1. author-$slug.php
  2. author-$id.php
  3. author.php
  4. archive.php
  5. index.php

Date Archive

Výpis příspěvků vybraného data.

  1. date-$slug.php
  2. date-$id.php
  3. date.php
  4. archive.php
  5. index.php

Custom Post Type Archive

Výpis příspěvků dle vybraného custom post type. Zatím nepotřebujeme, uvádím pro úplnost.

  1. archive-$posttype.php
  2. archive.php
  3. index.php

 Singular page

Samostatná stránka. Zde se to liší dle toho, zda jde o post, nebo page.

Post:

  1. single-post.php
  2. single.php
  3. index.php

Page:

  1. page-$slug.php
  2. page-$id.php
  3. page.php
  4. index.php

Celou hierarchii, jsem trochu zjednodušil, pro naše potřeby to zatím stačí, pokud si chcete prohlédnout kompletní graficky znázorněnou posloupnost šablony, můžete na Codexu WordPressu zde, věřím, že pokud jste si první díl přečetli, snadno graf pochopíte.

Budu se těšit u druhého dílu, kdy začneme vytvářet první soubory šablony.

Návod byl aktualizován k 5.1.2019

Seriál: Jak vytvořit vlastní šablonu pro WordPress

Exit mobile version