Chcete-li vlastní web, pravděpodobně ho postavíte na WordPressu. Je to rozumná volba. Dříve nebo později se ale setkáte s potřebou upravit si používanou šablonu k obrazu svému. A správným postupem při úpravách je child theme.
Ať už využíváte šablonu přímo od WordPressu, nebo některou z obrovské spousty ostatních, je několik doporučení, které byste měli znát ještě předtím, než se do úprav pustíte. Dnes se budu věnovat z mého pohledu tomu nejdůležitějšímu, a tím je využití tzv. child themes.
WordPress pro účely úprav šablon vytvořil metodiku child theme, což je ve stručnosti šablona, která dědí funkcionalitu od jiné šablony, rodičovské, či chcete-li nadřazené. Umožní vám upravovat nebo přidávat funkcionalitu rodičovské šabloně, aniž byste do ní museli jakkoliv zasahovat. Další výhody jsou:
bezpečnost – pokud se při úpravách něco nepovede, stačí v nastavení pouze přepnout zpět tu původní (rodičovské)
vytvoření a práce s child theme je velmi jednoduchá
pokud upravíte nějakou šablonu (bez použití child theme), a vyjde její nová verze kterou si updatujete, přijdete o své úpravy. S child theme zůstanou vaše úpravy i po updatu zachovány
pokud s WordPressem začínáte, je to dobrý způsob jak se učit a zároveň upravovanou šablonu nerozvrtat
Na serveru, v adresáři se šablonami (wp-content/themes) vytvořte novou složku. Do názvu zkopírujte název adresáře šablony, kterou chcete upravit, a na konec přidejte „-child“. Mezi původním názvem a „-child“ nesmí být mezery.
Druhým krokem je v nově vytvořeném adresáři vytvořit soubor style.css, který bude mít v úvodu následující hlavičku (příklad):
/*
Theme Name: Twenty Fourteen Child
Theme URI: http://example.com/twenty-fourteen-child/
Description: Twenty Fourteen Child Theme
Author: John Doe
Author URI: http://example.com
Template: twentyfourteen
Version: 1.0.0
*/
@import url("../twentyfourteen/style.css");
/* =Theme customization starts here
-------------------------------------------------------------- */
Upravte jednotlivé řádky, aby odpovídali vaší šabloně.
Tím je child theme v základu hotová. Úpravy stylů, které provedete v tomto souboru, „přepíší“ styly rodičovské šablony (ty nicméně zůstanou nedotčeny na serveru v adresáři původní šablony, no není to paráda? :-). Otestujte si, zda jste postupovali správně a změňte zde styl nějakého viditelného prvku webu.
Kromě stylů tímto způsobem můžete upravovat i další soubory šablony, jednotlivé php soubory. Například můžete upravit hlavičku a patičku (header.php a footer.php), nebo soubor pro zobrazování příspěvků (content.php) atd atd. Stačí daný soubor zkopírovat z rodičovské šablony do vaší child theme. Zkopírované soubory tam lze upravit a WordPress jimi pak opět bezpečně „přepíše“ původní soubory.
Já do child theme umisťuji také některé další soubory, se kterými v upravené šabloně pracuji, např. obrázky loga, favicon, různé ikony navigace apod. Na ně se pak odkazuji v php souborech jednoduše takto, př.:
<img src="<?php echo get_stylesheet_directory_uri(); ?>/images/logo.png" alt="Holan.eu" />
Upravovat můžete samozřejmě i funkce (typicky umístěné v souboru functions.php) a to podobným způsobem – vytvoříte soubor functions.php ve své child theme a umístíte zde své úpravy. Píšu „podobným“, protože u funkcí platí drobná výjimka v tom, jak WordPress functions.php zpracovává. Na rozdíl od style.css a ostatních souborů nepoužije WordPress obsah souboru functions.php k „přepsání“ toho původního, ale k jeho „doplnění“.
Jak už tušíte, tak zálohování vašeho vele-díla je také brnkačka. Prostě a jednoduše zkopírujete ze serveru celý adresář „vase_sablona-child“ se všemi soubory a podsložkami a je to.
Materiály k child theme včetně dalších technických detailů najdete přímo na WordPressu. Rozhodně také doporučuji prostudovat si základy WordPressu v podobě Template Hierarchy – to se určitě vyplatí, protože je zde popsáno, jak WordPress šablony fungují, co které soubory v šabloně dělají a kde je najít.