Každá WordPress (WP) stránka používa na vykresľovanie obsahu nejakú tému. Môj Web v súčasnosti používa tému Shapely. Je to jedna z najlepších tém pre WP, ktorá je úplne zadarmo. Nie je náročná na správu webu, ale keďže je zadarmo, tak neposkytuje nejaké extra funkcie. Hodí sa na jednoduchý web, kde je napr. blog, alebo nejaký prezentačný web.
Témy sa vo WP administrácii dajú veľmi jednoducho sťahovať a nasadzovať. Stačí stiahnutú tému aktivovať a rázom sa zmení náš web na nepoznanie (niekedy je to doslova na nepoznanie, pretože nie všetky témy si sadnú už z existujúcim webom a pluginmi). Ja som si chvalabohu obľúbil Shapely, ale nevylučujem, že ju budem používať do nekonečna. Všetky témy, ktoré stiahneme cez webovú administráciu WP sa ukladajú do adresára
/wp-content/themes/
Čiže moja hlavná téma je uložená v
/wp-content/themes/shapely
Pre nie programátora je obsahom tohto adresára zhluk rôznych súborov, ktorým rozhodne nebude rozumieť. Tieto súbory danej témy sú dostupné aj cez webové rozhranie WP, stačí sa presunúť do Vzhľad -> Editor tém a po vybratí konkrétneho súboru si môžeme meniť vzhľad webu. Základný súbor, ktorým môžeme meniť vzhľad webu je style.css. V tomto súbore je možné meniť čokoľvek sa týka zobrazenie webovej stránky. Spomeniem len základné veci ako napr. farba pozadia, veľkosť a font písma, farba linkov, odsadenie textov a mnoho mnoho iného. Takže teraz si môžeme nastýlovať web, tak ako sa nám bude páčiť. Super web teraz vyzerá tak ako chceme. Hlavný problém nastane, keď autor témy oznámi, že k dispozícií je aktualizácia. Ak spustíme aktualizáciu, tak prebehne proces, kde sa do príslušného adresára stiahnu nové súbory, ktoré prepíšu tie staré a mi prídeme o všetky naše úpravy. Aby sme o naše úpravy neprišli, tak použijeme child tému.
- Nadradená, alebo Parent (rodič) téma
- Podradená, alebo child (dieťa) téma
Naša aktívna téma je teraz Shapely. Tato téma v súčasnosti nie je ani nadradenou, ale ani podradenou, je to jednoducho téma. Teraz môžeme vytvoriť adresár, do ktorého neskôr uložíme súbory pre podradenú tému
/wp-content/themes/shapely-child
Na internete som našiel množstvo návodov ako vytvoriť child tému, ale nie všetky fungovali korektne. Nakoniec som našiel jednoduchý generátor tém a nechal som si súbory pre tému shapely vygenerovať. Obsahom stiahnutého zipu boli 3 súbory, ktoré som následne nakopíroval do spomínaného adresára, ktorý sme už vytvorili (viď vyššie)
- style.css
- functions.php
- screenshot.png
Obsahom vygenerovaných súborov je
style.css
/*
Theme Name: shapely-child
Theme URI: http://childtheme-generator.com/
Description: shapely-child is a child theme of Shapely, created by ChildTheme-Generator.com
Author: jany
Author URI: http://childtheme-generator.com/
Template: shapely
Version: 1.0.0
Text Domain: shapely-child
*/
/*
Add your custom styles here
*/
functions.php
<?php
add_action( 'wp_enqueue_scripts', 'shapely_child_enqueue_styles' );
function shapely_child_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
?>
screenshot.png
Je prázdny obrázok o veľkosti 600×450 px vo formáte png.
Teraz keď prejdeme do webovej administrácie WP a následne prejdeme v ponuke na Vzhľad -> témy, tak vidíme už aj novú podradenú child tému. Teraz ju môžeme nastaviť na aktívnu. Od teraz budeme mať nastavenú ako podradenú child tému a shapely sa stane nadradenou „parent“ témou. Keď budeme chcieť niečo v style.css zmeniť, tak všetky zmeny budeme robiť v podradenej téme. Ak autor témy vydá aktualizáciu, tak bez obav môžeme tému aktualizovať a zmeny, ktoré sme spravili v child téme ostanú zachované. Ja som to dnes otestoval tak, že obsah celého style.css z nadradenej témy som nakopíroval pod vygenerovaný obsah style.css do podradenej témy. Potom som aktualizoval tému shapely a zistil som, že v style.css už nemusím robiť žiadne úpravy. Čiže téma sa aktualizovala a zmeny ostali zachované.
Záver
Keď som pred necelými dvoma rokmi nainštaloval WP, tak som o nejakej child téme ani netušil a po pravidelných aktualizáciách som style.css upravoval ručne. Našťastie som mal poznačené čo potrebujem upraviť a nebolo toho veľa. Teraz však nepotrebujem upravovať nič. Ešte spomeniem, že ak používame aj dodatočné css, tak aj tie je potrebné to nakopírovať do child témy. Dodatočné css nájdeme v administrácií cez Vzhľad -> Prispôsobiť. Viac informácii ako funguje child téma je možné nájsť v linkoch pod článkom.