WordPress
Les bases du thème de l'enfant

Syntaxe

• template –– est le nom du thème WordPress principal, le parent.
• child-theme –– est le paquet qui remplace le modèle .

Remarques

<?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) le but

Les thèmes enfants sont un moyen sûr de conserver les personnalisations du modèle principal sans craindre de les perdre lors d'une mise à jour de thème.

Fondamentalement, chaque fois que vous voulez éditer un fichier dans le modèle actif de votre site Web, vous devez vous demander " Qu'est-ce qui va se passer lorsque je mettrai à jour le thème?

Et la réponse est simple: vous les perdez car la mise à jour apportera un dossier de thème entièrement nouveau .

Examinons donc un thème enfant en tant que dossier contenant des fichiers qui écrasent les fichiers ayant le même chemin dans le thème parent. Maintenant, apportons de vrais exemples:

Définition et exigences

Un thème enfant est identifié par WordPress lorsqu'il existe un répertoire (par exemple child-theme ) dans /wp-content/themes/ avec les fichiers suivants:

• style.css

  Ce fichier doit commencer par un modèle de commentaire comme celui-ci:

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

  Les choses les plus importantes à considérer ici sont:

  • Le nom du Template doit être exactement le nom du dossier qui contient le thème parent (le slug du thème parent)

  • Nommez votre thème enfant de manière à pouvoir l’identifier facilement dans Dashboard (en général, il suffit d’ajouter Child au nom du parent, comme Example Child ).

• index.php

• functions.php

3) Réécriture du modèle

L'utilisation la plus courante d'un thème enfant consiste à remplacer les parties de modèle. Par exemple, une barre latérale, si nous avons un thème avec le fichier suivant à

/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>

Nous pouvons certainement ajouter notre propre fichier dans le thème enfant (avec les spécifications du premier exemple) avec le fichier suivant

/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>

Maintenant, my-own-awesome-class est sûr dans le thème enfant et il ne sera supprimé d'aucune mise à jour de thème et WordPress choisira toujours un modèle parmi les thèmes enfants lorsqu'il en trouvera un sur le même chemin.

Remplacement d'actifs

Même si ce n'est pas une bonne pratique, vous devez parfois remplacer des éléments tels que des fichiers CSS ou JS ou des bibliothèques.

Notez que le système de remplacement de modèle WordPress ne fonctionne pas avec autre chose que les fichiers .php , donc lorsque nous parlons d'actifs, nous nous référons à des actifs enregistrés.

Un exemple pourrait être le remplacement de la bibliothèque jQuery par votre version souhaitée. Dans notre fichier functions.php thème enfant, nous devons ajouter une fonction qui supprime la version actuelle de jQuery et ajoutons notre propre version de CDN (rappelez-vous que ce n'est qu'un exemple).

/**
 * 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' );