Tomáš Daněk

Odovzený vzhled (sub téma) staví na základním tématu vzhledu, čímž vývojářům a designerům šetří mnoho práce.

Výhody:

• bezproblémová aktualizace (rodičovské) šablony bez ztráty vlastních úprav
• v případě nevhodného zásahu do vlastní šablony web vždy obsahuje alespoň jednu funkční šablonu na kterou je možné web přepnout

Dokumentace: Child Themes, Template Hierarchy (Visual Overview image)

1. Pro odvozené téma vzhledu vytvořte nový vlastní adresář např. /wp-content/themes/my_subtheme/.
2. Odvozený vzhled musí obsahovat pouze povinný soubor style.css (povinné řádky jsou pouze Theme Name a Template):

   • /*
     Theme Name: My subtheme
     Theme URI: http://theme-web.com (případně web, pro který je šablona vytvářena)
     Description: Custom theme based on Twenty Ten
     Author: Name Surname
     Author URI: http: //author-web.com
     Template: twentyten
     Version:  1.0.0
     Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
     Text Domain: twentyten-child
     */
     
     /* Import parent style – deprecated */
     @import url("../twentyten/style.css");
     
     /* Theme customization starts here
     -------------------------------------------------------------- */

   • Soubor style.css úplně nahrazuje soubor z rodičovské šablony, proto je nutné rodičovský styl "připojit". Doporučený způsob připojení všech stylů z rodičovského tématu je pomocí funkce viz níže.
3. Volitelný soubor rtl.css doplňuje vzhled o podporu jazyků psaných zprava doleva:
   • Dokumentace: Right-to-Left Language Support
   • Testování vzhledu: RTL Tester
   • Editor textu: WP-RTL
4. Na rozdíl od style.css volitelný soubor functions.php, který rozšiřuje funkcionalitu webu o vlastní funkce, nepřepisuje původní soubor functions.php z rodičovské šablony (jsou tedy načítány oba), což umožňuje předefinovat funkce v rodičovské šabloně.
   • Připojení všech stylů z rodičovského tématu:

     • <?php
       function theme_enqueue_styles() {
           $parent_style = 'parent-style';
           wp_enqueue_style($parent_style, get_template_directory_uri() . '/style.css');
           wp_enqueue_style('child-style',
               get_stylesheet_directory_uri() . '/style.css',
               array($parent_style)
          );
       }
       add_action('wp_enqueue_scripts', 'theme_enqueue_styles');
       ?>

   • Ošetření redeklarace funkce + vložení favicony do hlavičky:

     • <?php
       if (!function_exists("my_function")) {
          function my_function($parameter = true) {
             echo "My Custom Function";
          }
       } //endif functions_exists
       
       // Include favicon link to head section
       if (!function_exists("favicon_link")) {
         function favicon_link() {
           echo '<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />' . "\n";
         }
         add_action('wp_head', 'favicon_link');
       } //endif functions_exists
       
       // Get actual stylesheet directory path
       require_once(get_stylesheet_directory() . '/my_included_file.php');
       ?>

5. Při vytváření odvozeného vzhledu postupujte stejně jako při vytváření vlastního vzhledu (do adresáře s odvozeným vzhledem umisťujte soubory a adresáře), přičemž práci si ulehčíte tím, že budete vkládat pouze odlišné soubory od "základního" vzhledu.
6. Všechny soubory obsažené v odvozené šabloně (s výjimkou functions.php) přepisují soubory stejného názvu v rodičovském tématu. 
   • Např. pro úpravu "výpisu článku" tedy stačí jen z rodičovského tématu do odvozeného zkopírovat soubor single.php a upravit jej.