Comment créer un thème enfant pour les thèmes populaires (Astra / Hello / GeneratePress)

en utilisant Astra, Bonjour, GeneratePress Lorsque vous créez des sites Web à l'aide de thèmes WordPress courants, la modification directe du thème parent peut donner des résultats à court terme. Cependant, une fois le thème mis à jour, toutes les modifications seront écrasées, ce qui rendra très probable la perte des styles, voire provoquera des erreurs sur le site Web.Pour les sites web nécessitant un fonctionnement à long terme, les thèmes enfants restent une solution indispensable. Cet article expliquera de manière systématiqueComment faire AstraBonjour, Créer et utiliser correctement les thèmes enfants avec GeneratePressVous aider à personnaliser vos thèmes de manière sûre et efficace.

1. Qu'est-ce qu'un thème enfant WordPress ? Pourquoi faut-il l'utiliser ?

1.1 Définition des sous-thèmes

existent WordPress Au sein du système :

• Thème parentNoyau thématique avec fonctionnalités et style complets
• Thème enfant: Fonctionne sous le thème parent, permettant des extensions et des modifications sécurisées.

sous-thèmeIl héritera automatiquement de tous les modèles, fonctionnalités et styles du thème parent, permettant aux développeurs de remplacer uniquementLes sections nécessitant une modification.

1.2 Les conséquences réelles de la non-utilisation des thèmes enfants

La modification directe des fichiers du thème parent entraîne généralement les problèmes suivants :

• Après la mise à jour du thème, toute modification ultérieure sera écrasée et perdue définitivement.
• Des problèmes de compatibilité sont apparus à la suite de la mise à niveau du site Web.
• L'historique des révisions est chaotique, ce qui rend la maintenance ultérieure difficile.
• La logique de développement n'est pas conforme aux normes WordPress (convient uniquement aux extensions partielles).

La valeur fondamentale du thème enfant réside dans :

• Le thème parent peut être mis à jour à tout moment (bien sûr, si seul le thème enfant est utilisé, les mises à jour du thème parent deviennent moins importantes).
• Toutes les modifications personnalisées sont conservées de manière permanente.
• La structure fonctionnelle est claire et facile à entretenir.
• Projets de sites web adaptés à une exploitation à long terme

1.3 Pourquoi Astra / Hello / GeneratePress accordent-ils davantage d'importance à l'utilisation de thèmes enfants ?

La caractéristique commune à ces trois catégories de thèmes est la suivante :

• Mises à jour fréquentes
• La position officielle déconseille explicitement de modifier les fichiers du thème principal.
• Fortement dépendant des hooks/filtres pour l'extension

événement sportif	Astra	Bonjour (Elementor)	GeneratePress
Fréquence des mises à jour thématiques	votre (honorifique)	milieu	votre (honorifique)
Recommanderiez-vous un thème enfant ?	Fortement recommandé	témoignages	Fortement recommandé
Principales méthodes d'expansion	Crochets / Filtres	Modèle + PHP	Crochets
Modifier directement le thème parent comporte des risques.	extrêmement élevé	votre (honorifique)	extrêmement élevé
Objectif principal des thèmes enfants	Fonctionnalité + Style	Structure + Fonction	Axé sur la fonctionnalité

Conclusion : Ne pas utiliser de thèmes enfants comporte des risques extrêmement élevés.

II. Travaux préparatoires avant la création de thèmes enfants

2.1 Exigences environnementales de base

Avant de commencer, veuillez confirmer :

• Le thème parent a été correctement installé et activé.
• Accéder aux fichiers du serveur (via FTP ou le panneau de contrôle d'hébergement)
• Comprendre l'emplacement du répertoire des thèmes WordPress

Le chemin d'accès au répertoire des thèmes est :

• /wp-content/themes/

2.2 Quels fichiers sont nécessaires pour créer un thème enfant utilisable ?

Minimum viablesous-thèmeTout ce qui est requis, c'est 2 fichiers: :

nom de fichier	Est-ce nécessaire ?	Description du rôle
style.css	être	Déclaration relative aux informations sur les sous-thèmes
functions.php	être	Charger les styles du thème parent et du thème enfant
capture d'écran.png	bouché	Image d'aperçu du thème backend
fichier de modèles	bouché	Remplacer le modèle du thème parent

III. Méthode générale : création manuelle de thèmes enfants

cette méthode Applicable à tous les thèmes courantsComprend AstraBonjour, GeneratePress.

3.1 Créer un dossier pour le thème enfant

Entrer :

• /wp-content/themes/

Créez un nouveau dossier, par exemple :

• Enfant Astra
• Bonjour Elementor Child
• Thème enfant GeneratePress

Recommandations relatives aux conventions de dénomination :Nom du dossier parent + -enfant (tout en minuscules, sans espaces)

3.2 Créer et configurer style.css

Créer dans le dossier du thème enfant style.css

Écrire :

/* Nom du thème : Twenty Twenty-One Child URI du thème : https://wordpress.org/themes/twentytwentyone/ Description : Thème enfant Twenty Twenty-One Auteur : WordPress.org URI de l'auteur : https://wordpress.org/ Modèle : twentytwentyone Version : 1.0.0
Domaine du texte : twentytwentyonechild */

Spécifications clés du champ (doivent être correctes)

• Nom du thèmeAfficher le nom dans le backend
• Modèle: Nom du dossier parent, doit être identique

Valeurs correspondantes au thème commun :

Nom du sujet parent	Modèle : Entrer la valeur
Astra	astra
Bonjour	bonjour-élémentaire
GeneratePress	générer de la pression

Remarque : si le modèle contient des erreurs, le thème enfant ne fonctionnera pas.

3.3 Créer le fichier functions.php et charger correctement les styles

Créez un nouveau fichier dans le dossier du thème enfant. functions.php: :

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' ); function my_theme_enqueue_styles() {     $parenthandle = 'twenty-twenty-one-style'; // Il s'agit de « twenty-twenty-one-style » pour le thème Twenty Twenty-one.     wp_enqueue_style( $parenthandle, get_template_directory_uri() . '/style.css', array(), // si
    $theme = wp_get_theme(); wp_enqueue_style( $parenthandle, get_template_directory_uri() . '/style.css', array(), // si le code du thème parent a une dépendance, copiez-le ici $theme->parent()->get('Version') );
    wp_enqueue_style( 'custom-style', get_stylesheet_uri(), array( $parenthandle ), $theme->get('Version') // cela ne fonctionne que si vous avez Version dans l'en-tête de style ); }

• ceci est Compatibilité accrue, approche de mise en œuvre recommandée
• Chargez à la fois le thème parent etsous-thèmetype
• Utilisation déconseillée @import

3.4 Activation et vérification des thèmes enfants

Chemin d'accès backend : Apparence → Thèmes → Activer le thème enfant

Méthode de validation :

• Le site web s'affiche correctement sur l'interface utilisateur.
• Aucun problème de style n'a été détecté.
• Le thème actuellement affiché dans le backend est un thème enfant.

IV. Variations dans l'utilisation des sous-thèmes selon différents thèmes populaires

4.1 Recommandations pratiques pour les thèmes enfants Astra

• Nous recommandons vivement d'utiliser des thèmes enfants.
• De nombreuses fonctionnalités sont implémentées via des hooks.
• Évitez autant que possible de copier des fichiers modèles.
• Le code personnalisé est concentré dans functions.php

4.2 Recommandations pratiques pour les thèmes enfants Hello (Elementor) (corrections importantes)

Bonjour, c'est Thème minimaliste: :

• Le CSS par défaut est pratiquement inexistant.
• Le style est principalement contrôlé par Elementor.

Par conséquent :

• sous-thème Principalement utilisé pour la logique PHP et les structures de modèles
• Il n'est pas conseillé d'utiliser les styles comme objectif principal.
• Plus adapté à la création de fichiers de modèles personnalisés

4.3 Recommandations pratiques pour les thèmes enfants GeneratePress

• Thème haute performance avec une large gamme de hooks
• Officiellement, les hooks sont plus fortement recommandés que les remplacements de modèles.
• Les thèmes enfants sont utilisés pour :
  • fonction personnalisée
  • Structure spéciale
  • style auxiliaire

V. Applications pratiques courantes dans les thèmes enfants

5.1 Ajout d'un CSS personnalisé

Écrire dans le thème enfant style.css

Exemple :

.site-header { couleur-d'arrière-plan : ##111 ; }

Le but du code ci-dessus est :

• .en-tête-du-site Le sélecteur CSS pour la zone d'en-tête du site web
• couleur d'arrière-plan : ##111 ; Définissez la couleur d'arrière-plan de l'en-tête du site Web sur une couleur sombre (proche du noir).

Cette approche est particulièrement adaptée pour :

• Ajustez l'apparence du site Web, notamment les couleurs, les polices, l'espacement et d'autres styles visuels.
• Mettre en œuvre une personnalisation légère du style
• Maintenir la cohérence stylistique lors de la mise à jour des thèmes

5.2 Remplacement des fichiers modèles du thème parent

Les étapes :

1. Copier les fichiers modèles du thème parent
2. Coller dans le sous-thème avec la même structure de répertoires
3. Modifier les fichiers du thème enfant

WordPress donnera la priorité au chargement des modèles de thème enfant.

5.3 Ajout de code fonctionnel

Exemple : Supprimer l'affichage du numéro de version

remove_action( 'wp_head', 'wp_generator' );

Contactez nous
Vous n'arrivez pas à lire le tutoriel ? Contactez-nous pour une réponse gratuite ! Aide gratuite pour les sites personnels et les sites de petites entreprises !	Service clientèle WeChat
① Tel : 020-2206-9892
② QQ咨询：1025174874
(iii) Courriel : info@361sale.com
④ Horaires de travail : du lundi au vendredi, de 9h30 à 18h30, jours fériés.