V prípade, že ste vytvárali akúkoľvek webovú stránku pomocou WordPress, museli ste si vybrať a nainštalovať nejakú tému. Nie je dôležité či bezplatnú alebo platenú, tak viete, že ste si vyberali nejakú šablónu a inštalovali ju a táto šablóna vám umožnila isté funkcie, prispôsobila dizajn webovej stránky a poskytla isté možnosti upraviť si stránku podľa seba. Do akej miery to téma umožňuje záleží od toho ako dobre je výrobca spracoval.
Ďalšia vec, ktorú iste viete, že keď ste potrebovali rozšíriť funkcie webovej stránky, tak ste siahli zase do knižnice pluginov, ktorá je pre WordPress pomerne rozsiahla a obsahuje tisíce ak nie desiatky tisíc rôznych pluginov. Taktiež nájdete platené, bezplatné aj tzv. freemium (niečo je bezplatné a za niečo si treba zaplatiť.
Obvykle sa dajú štandardné funkcie nájsť priamo v nainštalovanej téme alebo sa dajú vyriešiť pomocou inštalácie rôznych pluginov (rozšírení). Avšak, toto prináša so sebou rôzne úskalia – napríklad:
- Môžete sa stretnúť s tým, že nie všetky rozšírenia budú spolu kompatibilné – zjednodušene – nebudú fungovať
- Čím viac rozšírení inštalujete, tým viac stránke škodíte – podobne ako v počítačí – zahltený počítač všetkým možným je čoraz pomalší a pomalší
- Nakoniec nie vždy pluginy vyriešia presne to, čo potrebujete
A práve v týchto prípadoch prichádza na rad odvodená (child) téma.
Ešte nemáš child tému Xtrodinary? Zadaj svoj e-mail a pošleme ti ju 🙂
1. Čo je to child téma pre WordPress?
Child téma, po slovensky nazývaná odvodená téma je pomocná šablóna, ktorá vylepšuje funkcie a efektívne zjednodušuje úpravy vizuálu aj funkčnosti webovej stránky na mieru.
Ide o nadstavbu základnej témy. To znamená, že vždy potrebujete mať nainštalovanú tému (šablónu) vo WordPresse a až vtedy môžete nainštalovať odvodenú tému. Bez základnej témy nebude tá odvodená fungovať.
2. Na čo je takáto téma dobrá?
Najdôležitejšia vec je rozumieť ako fungujú aktualizácie vo WordPresse – teda ako sa aktualizuje plugin, téma alebo WordPress samotný. V zásade je to jednoduché a jednoducho povedané – pri stlačení aktualizovať sa vymaže daný plugin / téma, stiahnu sa nové súbory zo serveru poskytovateľa a nahradia sa.
A práve toto je ten problém – ak chcete urobiť nejakú úpravu na mieru a zmeníte niektorý zo súborov hociakého pluginu alebo témy a následne spustíte aktualizáciu, tak o všetky zmeny prídete. Jediná možnosť ako tieto zmeny zachovať natrvalo je použiť odvodenú tému.
3. Ako ju nainštalovať?
Odvodená téma sa inštaluje rovnako ako každá iná téma. Po stiahnutí ZIP súboru je potrebné ho nahrať do WordPressu a aktvivovať. Je dôležité, aby bola nainštalovaná a aktivovaná nadradená téma. V tomto prípade sa bavíme o téme Divi. Čiže na fungovanie témy Xtrodinary je potrebná téma Divi.
4. Aké minimálne požiadavky musí téma spĺňať
Odvodená téma sa vytvára pomerne jednoducho a potrebuje pre svoje fungovanie v podstate len tri základné súbory:
- functions.php – hlavný súbor témy, ktorý determinuje jej funkcie. WordPress načítava funkcie z tohto súboru a implementuje ich do svojho fungovania. Vďaka premyslenému fungovaniu WordPress to funguje tak, že ak je akákoľvek funkcia zadefinovaná v odvodenej téme, načíta sa odtiaľto a funkcia v základnej téme je ignorovaná.
- style.css – toto je hlavný súbor štýlov odvodenej témy. Z tohto miesta sa načítajú všetky upravené štýly. Rovnako štýly odvodenej témy sú nadradené štýlom základnej témy.
- screenshot.png – toto je obrázok, ktorý sa zobrazuje v administrácii WordPress po nainštalovaní témy.
Každý z týchto súborov má svoj základný a špecifický obsah. Toto si rozoberieme v článku venovanému tvorbe odvodenej témy.
Na začiatok nám teraz postačuje vedieť, že na to, aby téma mohla fungovať ako odvodená, musí mať tieto tri základné súbory. Všetko ostatné je voliteľné.
5. Ako si ju môžem upraviť?
Toto je najtrdší oriešok celého procesu. Na toto je potrebné mať minimálne základy programovacieho jazyka PHP, HTML a CSS. Na to, aby ti téma na niečo bola a aby si si ju vedel upraviť z uvedených jazykov potrebuješ vedieť minimálne základy CSS a trochu mu rozumieť.
Vďaka aspoň základom CSS si dokážeš upravovať stránku pomocou odvodenej témy. Je však mimoriadne želané, aby si aspoň trochu rozumel PHP. Veľa čiastkových skriptov do odvodenej témy si dokážeš bez problémov nájsť na internete a pridať si ich tam do svojej odvodenej témy. Väčšinou však treba skripty aspoň trošku upraviť, aby fungovali v tvojich podmienkach.
6. Ako je to s témou Xtrodinary?
V tejto téme som zhromaždil niekoľko kódov, ktoré som počas svojej praxe tvorby webových stránok veľmi často potreboval a v Divi takéto funkcie neboli. Téma je predpripravená na použitie takým spôsobom, že jednotlivé čiastkové kódy sú popísané čo robia a sú zakomentované znakom #.
Zakomentovaný kód nie je serverom braný do úvahy = nerobí nič
Na to aby si jednotlivé funkcie aktivoval, je potrebné z každého riadku odstrániť komentovací znak – #. Potom začne kód plniť svoju funkciu.
7. Aké funkcie má téma Xtrodinary?
Podrobnejšie si to rozoberieme v samostatnom článku. Tu to napíšem iba heslovite:
- Pridanie možnosti vlastného loga a úprava základnej prihlasovacej stránky /wp-admin/
- Oprava prekladov v Divi pre češtinu a slovenčinu
- Implementovanie podpory nahrávania súborov SVG – vektorový formát, ktorý je defaultne pre WordPress zakázaný
- Odstránenie NOREFERRER atribútu z odkazov
- Premenovanie sekcie (CPT) „Projekty“ vrátane URL adresy a názvu
- Pridanie možnosti zobrazenia doplnkovej popisky pod položkami hlavného menu stránky
- Pridanie vlastného loaders pre plugin Divi FilterGrid
- Zmena odkazu „Pokračovať v nákupe“ pri tlačítku pre WooCommerce
- Úprava štítku „Zľava“ pri produktoch WooCommerce – pridanie percentuálnej zľavy
- Pridanie katalógového čísla (SKU) do košíka a pokladne WooCommerce
- Pridanie možnosti pridávať prílohu do mailov WooCommerce (napríklad obchodné podmienky)
- Pridanie možnosti zobrazovať ceny s DPH aj bez DPH vo WooCommerce
- Custom overovací mechanizmus pre Contact Form 7