WordPress
Basisthema voor kinderen

Syntaxis

• sjabloon –– is de naam van het hoofdthema van WordPress, de ouder.
• child-theme –– is het pakket dat de sjabloon overschrijft.

Opmerkingen

<?php
/**
 * The template for the sidebar containing the main widget area
 *
 * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
 */

if ( is_active_sidebar( 'sidebar-1' )  ) : ?>
    <aside id="secondary" class="sidebar widget-area" role="complementary">
        <?php dynamic_sidebar( 'sidebar-1' ); ?>
    </aside><!-- .sidebar .widget-area -->
<?php endif; ?>

2) Het doel

De onderliggende thema's zijn bedoeld als een veilige manier om aanpassingen van de hoofdsjabloon te houden zonder bang te zijn ze te verliezen bij een thema-update.

Kortom, wanneer u een bestand in de actieve sjabloon van uw website wilt bewerken, moet u zich afvragen: " Wat gaat er gebeuren als ik het thema update?"

En het antwoord is simpel: je verliest ze omdat de update een geheel nieuwe themamap brengt .

Laten we een kindthema dus bekijken als een map met bestanden die de bestanden met hetzelfde pad in het bovenliggende thema overschrijven. Laten we nu enkele echte voorbeelden brengen:

Definitie en vereisten

Een child-thema wordt geïdentificeerd door WordPress wanneer er een directory (bijvoorbeeld child-theme ) in /wp-content/themes/ met de volgende bestanden:

• style.css

  Dit bestand moet beginnen met een opmerkingensjabloon als deze:

   /*
   Theme Name: Example Child
   Author: Me
   Author URI: https://example.com/
   Template: example
   Text Domain: example-child-theme
   Domain Path: /languages/
   */
  

  De belangrijkste dingen om te overwegen zijn:

  • De Template moet exact de mapnaam zijn die het bovenliggende thema bevat (ook bekend als de bovenliggende themaslak)

  • Geef het thema van je kind een naam zodat je het gemakkelijk kunt herkennen in Dashboard (voeg meestal gewoon Child aan de naam van de ouder, zoals Example Child )

• index.php

• functions.php

3) Sjabloon overschrijven

Het meest voorkomende gebruik van een kindthema is het vervangen van sjabloononderdelen. Bijvoorbeeld een zijbalk, als we een thema hebben met het volgende bestand op

/themes/template/sidebar.php

<?php
/**
 * The sidebar containing the main widget area.
 *
 * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
 */ 

if ( ! is_active_sidebar( 'sidebar-1' ) ) {
    return;
}?>
<div id="sidebar" class="widget-area">
    <?php dynamic_sidebar( 'sidebar-1' ); ?>
</div>

We kunnen zeker ons eigen bestand in onderliggende thema (met de specificaties van het eerste voorbeeld) toevoegen met het volgende bestand

/themes/child-theme/sidebar.php

<?php
/**
 * The sidebar containing the main widget area.
 */ 

if ( ! is_active_sidebar( 'sidebar-1' ) ) {
    return;
}?>
<div id="my-sidebar" class="my-own-awesome-class widget-area">
    <div class="my-wrapper">
        <?php dynamic_sidebar( 'sidebar-1' ); ?>
    </div>
</div>

Nu is my-own-awesome-class veilig in het thema van het kind en het zal niet worden verwijderd bij elke thema-update en WordPress zal altijd een sjabloon kiezen uit het thema van het kind wanneer het er wel een op hetzelfde pad vindt.

Activa vervanging

Zelfs als dit geen best practice is, moet u soms middelen zoals CSS- of JS-bestanden of bibliotheken vervangen.

Merk op dat het WordPress-sjabloonoverschrijvingssysteem niet werkt met iets anders dan .php bestanden, dus als we het over activa hebben, verwijzen we naar geregistreerde activa

Een voorbeeld zou de vervanging van jQuery-bibliotheek door uw gewenste versie kunnen zijn. In ons onderliggende thema functions.php bestand moeten we een functie toevoegen die de huidige jQuery versie verwijdert en die van ons toevoegen vanaf CDN (onthoud dit is slechts een voorbeeld).

/**
 * Dequeue the jQuery script and add our own version.
 *
 * Hooked to the wp_print_scripts action, with a late priority (100),
 * so that it is after the script was enqueued.
 */
function my_own_theme_scripts() {
    // remove the current version
    wp_dequeue_script( 'jquery' );
    // register my desired version
    wp_register_script( 'jquery', 'https://code.jquery.com/jquery-3.1.0.min.js', false, '3.1.0' );
    // load my version, here or somewhere else
    wp_enqueue_script( 'jquery' );
}
add_action( 'wp_print_scripts', 'my_own_theme_scripts' );