Un thème enfant pour Twenty Seventeen (WordPress)

J’ai besoin d’utiliser un thème enfant du thème WordPress Twenty Seventeen. Dans cet article, j’explique comme le créer et le modifier légèrement. D’autres articles de cette série expliqueront des modifications plus importantes.

Création d’un thème enfant

A l’aide de Filezilla (ou autre accès en FTP) créer un répertoire 2017-child  dans wp-content/themes/  du site WordPress utilisé.

Y placer les trois fichiers suivants :

  1. functions.php
  2. style.css
  3. screenshot.png (optionnel) : une image de votre choix, au format 600 px de large et 450 px de haut.

Dans functions.php, placer le code suivant (source Codex WordPress)  :

<?php 
add_action( 'wp_enqueue_scripts', 'tw17_child_enqueue_styles' );

function tw17_child_enqueue_styles() { 

    $parent_style = 'twentyseventeen-style-css'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'tw17-child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );

} 

?>

Dans style.css , il doit y avoir l’en-tête suivant :

/* 
Theme Name:		 Twenty Seventeen Child
Theme URI:		 
Description:	 Thème enfant de twenty seventeen
Author:			 ALD
Author URI:		 http://knowledge.parcours-performance.com/
Template:		 twentyseventeen
Version:		 1.0.0
License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:	 Tw17-child
-------------------------------------------------------------- */ 

Et voilà, maintenant le tableau de bord WordPress me propose le thème « Twenty Seventeen Child ».

Modifier le contenu de la page d’accueil

Par défaut, le thème est réglé avec la page « Accueil » comme page d’accueil statique. Je n’y touche pas.

Par contre, je veux modifier le contenu automatique de cette page.

La page d’accueil statique de Twenty Seventeen

Elle contient d’abord le contenu de la page réglée comme page d’accueil statique puis les contenus des 4 sections définies dans le menu « apparence / Personnaliser / Options du thème ».

Je crée 4 pages, intitulées « Caméra », « Nest », « Eedomus » et « Autres » et je les publie.

Ensuite dans le tableau de bord WordPress, je choisis « apparence / Personnaliser / Options du thème » puis j’affecte chacune des pages créées à l’une des 4 sections.

Pour aller plus loin, voir « How to Customize the Free Twenty Seventeen WordPress Theme« .

Créer des modèles de page

A l’aide de Filezilla (ou autre accès en FTP) copier le fichier page.php du thème Twenty Seventeen (répertoire wp-content/themes/twentyseventeen ).

Placer ce fichier dans un répertoire pages  dans wp-content/themes/2017-child/  du site WordPress utilisé. Le renommer (pour moi al-dashboard-1.php) et en modifier le contenu pour que l’en-tête contienne un « template name » :

<?php
/**
 * Template Name: maquette section 1 (caméra)
 */

Maintenant, si je vais modifier (ou créer) une page dans le site, dans la barre latérale de droite, dans le bloc « Attributs de la page », la liste déroulante « modèles » me propose « maquette section 1 (caméra) ».

Mais attention, si cette page doit être insérée dans la page d’accueil, seul le contenu créé avec l’éditeur WordPress s’affiche…

Et maintenant ?

Je vais utiliser ce thème enfant pour construire un tableau de bord domotique pour ma maison. J’en explique les étapes de construction dans la série d’article . Lorsque je ferai des modifications du thème enfant que je viens de créer, je les expliquerai dans les articles suivants de cette série

9
Poster un Commentaire

avatar
  S’abonner  
le plus récent le plus ancien le plus populaire
Notifier de
Okom
Invité
Okom

Bonjour,
Merci pour ce tuto,
Mais j’ai cette erreur qui s’affiche quand j’active le 2017-child chez moi pouvez-vous m’aider ?
Fatal error: Cannot redeclare twentyseventeen_setup() (previously declared in /…/public_html/wp-content/themes/2017-child/functions.php:34) in /…/public_html/wp-content/themes/twentyseventeen/functions.php on line 216

Graebling
Invité
Graebling

Bonjour,
J’ai récemment créé un site avec twenty seventeen.
J’ai réalisé toutes mes modifs css sur twenty seventeen.
Est-il important de créer néanmoins un thème enfant ?
Merci de votre retour.
Cordialement

Human-Octopus
Invité
Human-Octopus

Bonjour,

Merci pour ce tutoriel simple et claire.
Seulement en local ça ne fonctionne pas pour moi. C’est comme si la feuille de style n’était pas prise en compte.
Une idée d’où cela peu venir ?
Mon chemin est le suivant : ‘/style.css’, je ne pense pourtant pas que le fait que le site soit développé en local fasse que ça ne passe ?