J’ai besoin de modifier des fichiers (php et css) du thème Divi. Je crée donc un thème enfant qui me permettra de faire ces modifications sans toucher au thème Divi et en maintenant sa capacité à se mettre à jour. Dans cette article de la série Utiliser le thème DIVI d’Elegant Themes, j’explique comment s’organiser et créer ce thème enfant.
La situation initiale
Je suis sur un site de test, avec le thème Divi que j’ai déjà largement réglé. Bon nombres d’éléments de la personnalisation et des options du thème ont été modifiés. J’ai aussi réglé des barres latérales avec des widgets.
Il va donc falloir que je conserve tous ces ajustements.
Créer un thème enfant
Normalement, pour créer un thème enfant, il suffit de créer un répertoire dans wp-config/themes/ et d’y placer un fichier style.css contenant au moins un nom (theme name) et indiquant que c’est un thème enfant de Divi (Template: Divi) :
/*--------------------------------------------------------------------------------- Theme Name: LE NOM DU THEME Theme URI: Description: A child theme for Divi Author: Anne-Laure Author URI: https://knowledge.parcours-performance.com/ Template: Divi Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html */ /* On peut mettre du CSS additionnel à partir d'ici */
Mais je ne connais pas encore bien Divi, et j’ai vu qu’il existait un site « constructeur de thème enfant pour Divi ». Alors j’ai essayé.
Je suis donc allée sur la page du « Divi child theme builder » du site divi.space.
J’ai rempli les lignes du formulaire puis téléchargé le fichier zip.
En regardant le contenu des fichiers, j’ai constaté que login-editor.php contient des éléments qui modifient la personnalisation de la page de login du site. J’ai décidé de laisser ce fichier, et l’instruction qui le requiert dans functions.php. Mais on peut certainement les supprimer.
Ensuite, j’ai installé le fichier zip sur le site mais je ne l’ai pas activé tout de suite.
Sauvegarder les réglages du thème parent
Avant d’activer le thème enfant, sauvegarder les fichiers de réglage de divi, comme indiqué dans l’article Importer et exporter des paramètres et modèles du thème Divi pour WordPress, (uniquement ce qui concerne la personnalisation et les options du thème).
Pour les widgets placés dans des barres latérales (les « sidebars » qui peuvent aussi être en dessous ou au dessus !), je ne sais pas comment les récupérer automatiquement. Il faut donc faire des copies d’écran et de contenus…
MAJ du 28/09/2017 pour exporter les réglages de widgets :
pour les widget, utiliser l’extension Widget Settings Importer/Exporter. Attention, toutes les extensions utilisées pour générer des éléments des widgets doivent avoir été activées au préalable et réglées si nécessaire.
Ensuite dans le tableau de bord WordPress, menu outils, on a Widget Settings Import et export.
On peut choisir ce que l’on exporte. On obtient un fichier widget_data.json que l’on sauvegarde. Ensuite on pourra importer ce fichier. Ca marche parfaitement pour moi.
Activer le thème enfant puis le régler
J’active le thème enfant puis j’mporte la personnalisation et les options du thème Divi que j’ai sauvegardé.
Je recrée les barres latérales à la main ou par importation avec l’extension Widget Settings Importer/Exporter.
Et ça y est, on a un thème enfant fonctionnel !
Et maintenant ?
Dans le prochain article de cette série Utiliser le thème DIVI d’Elegant Themes, je modifie Divi grâce à mon thème enfant : je crée un nouveau modèle (template) pour les pages de catégories et j’ajoute un style spécifique.