Articles

WordPress.org (Français)

Posted by admin

Un thème enfant vous permet de modifier de petits aspects de l’apparence de votre site tout en préservant l’apparence et les fonctionnalités de votre thème. Pour comprendre le fonctionnement des thèmes enfants, il est d’abord important de comprendre la relation entre les thèmes parents et enfants.

qu’est Ce qu’un Thème Parent? #Qu’est ce qu’un Thème Parent?

un thème parent est un thème complet qui comprend tous les fichiers de modèles WordPress et les ressources nécessaires pour que le thème fonctionne., Tous les thèmes – à l’exclusion des thèmes enfants-sont considérés comme des thèmes parents.

Haut de page

qu’est Ce qu’un Thème Enfant? #Qu’est ce qu’un Thème Enfant?

Comme indiqué dans l’aperçu, un thème enfant hérite de l’apparence du thème parent et de toutes ses fonctions, mais peut être utilisé pour apporter des modifications à n’importe quelle partie du thème. De cette façon, les personnalisations sont séparées des fichiers du thème parent. L’utilisation d’un thème enfant vous permet de mettre à niveau le thème parent sans affecter les personnalisations que vous avez apportées à votre site.,

thèmes enfants:

  • rendre vos modifications portables et reproductibles;
  • garder la personnalisation séparée des fonctions de thème parent;
  • permettre aux thèmes parents d’être mis à jour sans détruire vos modifications;
  • vous permettre de profiter des efforts et des tests mis dans le thème parent;
  • économiser du temps de développement puisque vous ne recréez pas la roue; et
  • sont un excellent moyen de commencer à apprendre sur le développement de thème.,
Remarque: Si vous faites des personnalisations étendues, au – delà des styles et quelques fichiers de thème – la création d’un thème parent peut être une meilleure option qu’un thème enfant. La création d’un thème parent vous permet d’éviter les problèmes de code obsolète à l’avenir. Cela doit être décidé au cas par cas.

Haut de page

Comment Créer un Thème Enfant #Comment Créer un Thème Enfant

Créer un thème enfant dossier #1. Créer un dossier de thème enfant

tout d’abord, créez un nouveau dossier dans votre répertoire de thèmes, situé à wp-content/themes.

Le répertoire besoin d’un nom., Il est préférable de donner à un thème enfant le même nom que le parent, mais avec -child ajouté à la fin. Par exemple, si vous avez été faire un thème enfant de twentyfifteen, puis le répertoire serait nommé twentyfifteen-child.

Haut de page

Créer une feuille de style: le style.css # 2. Créer une feuille de style: style.css

ensuite, vous devrez créer un fichier de feuille de style nomméstyle.css, qui contiendra toutes les règles et déclarations CSS qui contrôlent l’apparence de votre thème., Votre feuille de style doit contenir le commentaire d’en-tête requis ci-dessous tout en haut du fichier. Cela indique à WordPress des informations de base sur le thème, y compris le fait qu’il s’agit d’un thème enfant avec un parent particulier.

Développez source complet codeCollapse l’intégralité du code source

Les informations suivantes sont requises:

  • Thème Nom doit être unique dans votre thème
  • Modèle – le nom du thème parent directory. Le thème parent dans notre exemple est le thème Twenty Fifteen, donc le modèle sera twentyfifteen., Vous travaillez peut-être avec un thème différent, alors ajustez en conséquence.

ajouter les informations restantes, le cas échéant. Le seul fichier de thème enfant requis est style.css, mais fonctions.php est nécessaire pour mettre en file d’attente les styles correctement (ci-dessous).

Top

mise en file d’attente feuille de style #3. Feuille de style mise en file d’attente

la dernière étape consiste à mettre en file d’attente les feuilles de style des thèmes parent et enfant, si nécessaire.

remarque: dans le passé, la méthode courante consistait à importer la feuille de style du thème parent en utilisant @import dans style.css., Ce n’est plus la pratique recommandée, car cela augmente le temps nécessaire au chargement des feuilles de style. De plus, il est possible que la feuille de style parent soit chargée deux fois.

le moyen idéal de mettre en file d’attente les feuilles de style est que le thème parent charge les deux (parent et enfant), mais tous les thèmes ne le font pas. Par conséquent, vous devez examiner le code du thème parent pour voir ce qu’il fait et pour obtenir la poignée nom du thème parent utilise. Le handle est le premier paramètre de wp_enqueue_style().,

Il ya quelques choses à garder à l’esprit:

  • le thème de l’enfance est chargé avant le thème parent.
  • tout est accroché à une action avec une priorité (la valeur par défaut est 10) mais ceux avec la même priorité s’exécutent dans l’ordre dans lequel ils ont été chargés.
  • pour chaque handle, seul le premier appel à wp_enqueue_style() est pertinent (les autres ignorés).
  • le paramètre de dépendance de wp_enqueue_style() affecte l’ordre de chargement.
  • Sans numéro de version, les visiteurs du site obtiendront tout ce que leur navigateur a mis en cache, au lieu de la nouvelle version.,
  • l’utilisation d’une fonction pour obtenir la version du thème renverra la version du thème actif (enfant s’il y a un enfant).
  • Les fonctions nomméesget_stylesheet* recherchez d’abord un thème enfant, puis le parent.

la façon recommandée de mettre en file d’attente les feuilles de style est d’ajouter une actionwp_enqueue_scriptset d’utiliserwp_enqueue_style()dans le thème de votre enfantfunctions.php.
Si vous n’en avez pas, créez un functions.php dans le répertoire de votre thème enfant., La première ligne du thème de votre enfantfunctions.php sera une balise PHP d’ouverture (<?php), après quoi vous pouvez écrire le code PHP en fonction de ce que fait votre thème parent.

Si le thème parent charge les deux feuilles de style, le thème enfant n’a rien à faire.

Si le thème parent charge son style en utilisant une fonction commençant parget_template, telle queget_template_directory() Etget_template_directory_uri(), le thème enfant doit charger uniquement les styles enfants, en utilisant la poignée du parent dans le paramètre de dépendance.,

Si le thème parent charge son style à l’aide d’une fonction commençant parget_stylesheet, telle queget_stylesheet_directory() Etget_stylesheet_directory_uri(), le thème enfant doit charger les feuilles de style parent et enfant. Assurez-vous d’utiliser le même nom de poignée que le parent pour les styles parents.

Développez source complet codeCollapse l’intégralité du code source

Haut de page

Installer un thème enfant #4. Installer le thème enfant

installez le thème enfant comme vous installez n’importe quel autre thème., Vous pouvez copier le dossier sur le site en utilisant FTP, ou créer un fichier zip du dossier de thème enfant, en choisissant l’option pour maintenir la structure des dossiers, et cliquez sur Apparence > thèmes > Ajouter nouveau pour télécharger le fichier zip.

Top

activer le thème enfant #5. Activer le thème enfant

votre thème enfant est maintenant prêt à être activé. Connectez-vous à votre site de l’Écran d’Administration, et aller à l’Écran d’Administration > Apparence > Thèmes., Vous devriez voir le thème de votre enfant répertorié et prêt à être activé. (Si votre installation WordPress est activée sur plusieurs sites, vous devrez peut-être passer à l’écran d’Administration réseau pour activer le thème (dans L’onglet écran Thèmes D’administration réseau). Vous pouvez ensuite revenir à L’écran D’Administration WordPress spécifique à votre site pour activer votre thème enfant.)

Remarque: vous devrez peut-être réenregistrer votre menu à partir de L’apparence > Menus et options de thème (y compris les images d’arrière-plan et d’en-tête) après avoir activé le thème enfant.,

Top

ajout de fichiers de modèle #ajout de fichiers de modèle

autre que le fichierfunctions.php (comme indiqué ci-dessus), tout fichier que vous ajoutez à votre thème enfant écrasera le même fichier dans le thème parent.

dans la plupart des cas, il est préférable de créer une copie des fichiers modèles que vous souhaitez modifier à partir du thème parent, puis d’apporter vos modifications aux fichiers copiés, en laissant les fichiers parents inchangés., Par exemple, si vous souhaitez modifier le code du fichier header.php du thème parent, vous devez copier le fichier dans votre dossier de thème enfant et le personnaliser.

astuce: il existe plusieurs plugins qui vous permettent de détecter quel modèle spécifique est utilisé sur la page sur laquelle vous regardez.

  • Quel est le fichier
  • quel fichier modèle est-ce que je consulte?
  • Debug Bar

Vous pouvez également inclure des fichiers dans le thème de l’enfance qui ne sont pas inclus dans le thème parent., Par exemple, vous pouvez créer un modèle plus spécifique que celui de votre thème parent, tel qu’un modèle pour une archive de page ou de catégorie spécifique (par exemple page-3.php se chargerait pour une Page avec L’ID de 3).

consultez la page hiérarchie des modèles pour plus d’informations sur la façon dont WordPress détermine le modèle à utiliser.

Haut de page

Utilisation des fonctions.php # en utilisant des fonctions.php

contrairement àstyle.css, lefunctions.php d’un thème enfant ne remplace pas son homologue du parent. Au lieu de cela, il est chargé en plus des fonctions du parent.,php. (Plus précisément, il est chargé juste avant le fichier du parent.)

de cette façon, le functions.php d’un thème enfant fournit une méthode intelligente et sans problème pour modifier les fonctionnalités d’un thème parent. Dites que vous voulez ajouter une fonction PHP à votre thème. Le moyen le plus rapide serait d’ouvrir son fichier functions.php et d’y placer la fonction. Mais ce n’est pas intelligent: la prochaine fois que votre thème sera mis à jour, votre fonction disparaîtra., Mais il existe une autre méthode intelligente: vous pouvez créer un thème enfant, y ajouter un fichier functions.php et ajouter votre fonction à ce fichier. La fonction fera exactement le même travail à partir de là aussi, avec l’avantage qu’elle ne sera pas affectée par les futures mises à jour du thème parent. Ne copiez pas le contenu complet des fonctions.php du thème parent en fonctions.php dans le thème enfant.

la structure de functions.php est simple: une balise PHP d’ouverture en haut, et en dessous, vos bits de PHP. Vous pouvez y mettre autant ou aussi peu de fonctions que vous le souhaitez., L’exemple ci-dessous montre un fichier élémentaire functions.php qui fait une chose simple: ajoute un lien favicon à l’élément head des pages HTML.

Astuce: le fait que les fonctions d’un thème enfant.php est chargé en premier signifie que vous pouvez rendre les fonctions utilisateur de votre thème enfichables —c’est— à-dire remplaçables par un thème enfant-en les déclarant conditionnellement.

if ( ! function_exists( 'theme_special_nav' ) ) { function theme_special_nav() { // Do something. }}

de cette façon, un thème enfant peut remplacer une fonction PHP du parent en la déclarant simplement au préalable.,

Pour plus d’informations sur les éléments à inclure dans le fichierfunctions.php de votre thème enfant, consultez la page fonctions du thème.

Top

référencement ou inclusion D’autres fichiers #référencement ou inclusion d’autres fichiers

lorsque vous devez inclure des fichiers qui résident dans la structure de répertoires de votre thème enfant, vous devez utiliser get_stylesheet_directory(). Étant donné que style.css se trouve à la racine du sous-répertoire de votre thème enfant, get_stylesheet_directory() pointe vers le répertoire de votre thème enfant (pas le répertoire du thème parent)., Pour référencer le répertoire de thème parent, vous utiliseriez get_template_directory () à la place.

Voici un exemple illustrant comment utiliser get_stylesheet_directory() lors du référencement d’un fichier stocké dans le répertoire de thème enfant:

<?php require_once( get_stylesheet_directory(). '/my_included_file.php' ); ?>

pendant ce temps, cet exemple utilise get_stylesheet_directory_uri() pour afficher une image stockée dans le /images dossier dans le répertoire de thème enfant.,

<img src="https://developer.wordpress.org/themes/advanced-topics/child-themes/<?php echo get_stylesheet_directory_uri(); ?>/images/my_picture.png" alt="" />

Top

mise en file D’attente Styles et Scripts #mise en file d’attente Styles et Scripts

les Scripts et les styles doivent chacun être mis en file d’attente avec leur propre fonction, puis ceux-ci doivent être enveloppés dans une action. Pour plus d’informations, lisez la page sur L’inclusion de CSS et JavaScript.

WordPress ne chargera pas automatiquement la feuille de style de votre thème enfant sur le front-end. Voici un exemple d’utilisation du crochet d’action wp_enqueue_scripts() pour appeler une fonction qui met en file d’attente la feuille de style du thème enfant.,

Top

considérations spéciales #considérations spéciales

Top

formats de publication #Formats de publication

Un thème enfant hérite des formats de publication tels que définis par le thème parent. Mais lors de la création de thèmes enfants, sachez que l’utilisation de add_theme_support('post-formats') remplacera les formats tels que définis par le thème parent, et non l’ajoutera.,

Haut de page

RTL Soutien #RTL Support

À l’appui de RTL langues, ajoutez une balise rtl.css le fichier de votre thème enfant, contenant:

/*Theme Name: Twenty Fifteen ChildTemplate: twentyfifteen*/

Même si le thème parent n’a pas de rtl.css fichier, il est recommandé d’ajouter la balise rtl.css le fichier de votre thème enfant. WordPress chargera automatiquement le fichierrtl.css uniquement siis_rtl() est vrai.,

Top

internationalisation #internationalisation

les thèmes enfants peuvent être préparés pour être traduits dans d’autres langues en utilisant L’API D’internationalisation WordPress. Il y a des considérations spéciales concernant l’internationalisation des thèmes pour enfants.

pour internationaliser un thème enfant, procédez comme suit:
1. Ajouter un répertoire de langues.

  • Par exemple: twentyfifteen-child/languages/

2. Ajouter des fichiers de langue.,

  • Vos noms de fichiers doivent être he_IL.po & he_IL.mo (selon la langue), à la différence des fichiers de plugin qui sont domain-he_IL.xx.

3. Charger un textdomain

  • utilisez load_child_theme_textdomain() dans functions.php pendant l’action after_setup_theme.
  • Le Domaine de texte défini dans load_child_theme_textdomain() doit être utilisé pour traduire toutes les chaînes du thème enfant.

4. Utilisez les fonctions GetText pour ajouter le support i18n à vos chaînes.,

exemple: textdomain #exemple: textdomain

à ce stade, les chaînes du thème enfant sont prêtes à être traduites. Pour s’assurer qu’elles sont correctement internationalisées pour la traduction, chaque chaîne doit avoir le domaine de texte twentyfifteenchild.

Top

exemple: fonctions gettext #exemple: fonctions gettext

Voici un exemple d’écho de la phrase « Code is Poetry”:

<?phpesc_html_e( 'Code is Poetry', 'twentyfifteenchild' );?>

le domaine de texte défini dansload_child_theme_textdomain() doit être utilisé pour traduire toutes les chaînes du thème enfant., Dans le cas où un fichier modèle du parent them a été inclus, le domaine de texte doit être modifié de celui défini dans le thème parent à celui défini par le thème enfant.

Leave A Comment