Po měsíční pauze je zde další díl seriálu, v kterém se naučíte vytvořit vlastní šablonu pro WordPress. V minulém díle jme si vytvořili základní kostru naší theme a dnes si ji doplníme o další soubory, pro výpis kategorie, archívu, vyhledávání, stránky 400 a vyhledávacího formuláře. Také si vytvoříme vyhledávací formulář. Takže pojďme na to.
Nejprve shrnutí toho, co jsme si již vytvořili. Máme složku šablony, v které jsou následující soubory:
- footer.php
- functions.php
- header.php
- index.php
- style.css
- sidebar.php
Dnes si do šablony doplníme další soubory. Protože ve functions.php načítáme pomocí enqueue soubory bootstrapu, vytvořili jsme složku assets, kam jsme požadované soubory vložili. V šabloně máme tedy zatím jednu složku a v ní dvě podsložky:
- assets
- js
- css
Screenshot.png
Ještě než se pustíme do vytváření nových souborů, připravíme si screenshot.png, což je obrázek, který reprezentuje šablonu v administraci. Doporučený rozměr je 600 x 450 px, dříve byl standart poloviční, ale s nástupem hd přístrojů doporučuje WordPress tuto velikost. Já jsem vytvořil jednu nádheru 🙂 , která nám bude muset stačit.
Nové soubory
A už se můžeme pustit do nových souborů, vytvoříme si následující php soubory:
- 404.php
- author.php
- archive.php
- category.php
- search.php
- searchform.php
- tag.php
Drobná úprava souboru index.php
Než začneme s vytvářením dalších souborů, upravíme si lehce soubor index.php.
- přidáme divu obalující obsah id primary a třídu content area
- pridáme nový tag main, obalující obsah stránky
- napis stránky obalíme tagem header
Stránka 404
První z nich je stránka 404, která se zobrazí, pokud WordPress nenalezne obsah který hledáte. Můžete namítnout, že na to stačí podmínka v šabloně, kterou tam stejně máme. To je sice pravda, ale stránka 404 vám dává možnost vložit například vyhledávací formulář, nebo nasměrovat čtenáře žádoucím směrem, tedy mu nabídnout jiný obsah.
Vytvoříme tedy soubor 404.php a do něj vložíme následující kód:
Archiv.php, category.php a další
Těmto stránkám já osobně říkám „výpisové“, protože se starají s výpis obsahu, který má nějakou společnou vlastnost, například se jedná o články od jednoho autora, z jedné kategorie, či dle vyhledávacího dotazu. Ve valné většině šablon se setkáte s tím, že existuje search.php pro výpis hledání a pak archiv.php, který má na začátku ukrutnou konstrukci, která rozlišuje, zda se jedná o výpis dle měsíce, autora, atd…
Může se zdát, že jsou tedy další soubory zbytečné, ale díky nim můžete šablonu daleko více upravovat pro vaše potřeby. Například v author.php můžete mít na začátku výpisu informace o konkrétním autorovi, dle jeho profilu. A to je určitě zajímavé. Protože jsou však všechny tyto soubory velmi podobné, nebudu je blíže rozebírat, rozdíly uvidíte na první pohled.
Archive.php
Protože jsou zbylé soubory podobné, nebudu je nijak komentovat.
Author.php
Výpis článků od jednoho autora.
Search.php
Výpis vyhledávání
Jak je vidět soubory se v podstatě liší pouze tím, co se vypíše před samotným loopem, tedy titulkem archívu. Na konci výpisu článků je vždy navigace, která umožňuje pohyb mezi stránkami.
Jako poslední soubor dnes vytvoříme searchform.php. Je to v podstatě vyhledávací formulář, který se zobrazuje například v sidebaru. Proč jej však budeme znovu psát, když jej WordPress vykreslí automaticky? Protože se nám můžet hodit, mít jiné html, něž nám WordPress nabídne a tento soubor nám to umožní.
Searchform.php
Závěr
Dnes jsme si tedy rozšířili šablonu o další soubory a v šabloně tedy máme následující části:
- 404.php
- archive.php
- author.php
- category.php
- footer.php
- functions.php
- header.php
- index.php
- screenshot.png
- search.php
- searchform.php
- sidebar.php
- style.css
- tag.php
a složky
- bootstrap
- images
- js
Všechny doposud vytvořené soubory jsou dostupné na Gist a jsou označené číslem kapitoly, takže můžete porovnávat změny.
Repositář šablony najdete na GitHubu, ale stav kódu bude odpovídat poslední kapitole návodu : https://github.com/Musilda/dummy-theme
Co bude příště?
V příštím díle vytvoříme single.php a page.php pro výpis detailu stránky a článku, rozšíříme šablonu o podporu náhledových obrázků a připravíme si statickou hlavní stranu.
Návod byl aktualizován k 5.1.2019
Seriál: Jak vytvořit vlastní šablonu pro WordPress
- Jak vytvořit vlastní šablonu pro WordPress 1.díl
- Jak vytvořit vlastní šablonu pro WordPress 2.díl
- Jak vytvořit vlastní šablonu pro WordPress 3.díl
- Jak vytvořit vlastní šablonu pro WordPress 4.díl
- Jak vytvořit vlastní šablonu pro WordPress 5.díl
- Jak vytvořit vlastní šablonu pro WordPress 6.díl
- Jak vytvořit vlastní šablonu pro WordPress 7.díl
- Jak vytvořit vlastní šablonu pro WordPress 8.díl
