Comment Créer un Template de Page WordPress Personnalisé
La conception d’un site web peut prendre beaucoup de temps. Même si vous utilisez un thème WordPress puissant ou un constructeur de pages, vous pouvez passer des heures à construire et à modifier vos pages. En outre, vous préférez peut-être créer un template de page WordPress personnalisé plutôt que d’utiliser une mise en page générique et préétablie.
En créant des modèles WordPress, vous pouvez les appliquer à n’importe quelle page de votre site web. Vous pouvez ainsi modifier la conception générale de votre site web sans avoir à mettre à jour manuellement chaque page.
Dans cet article, nous allons voir pourquoi vous pourriez vouloir utiliser des modèles de page personnalisés. Nous vous montrerons ensuite comment les créer dans WordPress. Commençons par le commencement !
Sommaire
Comment créer un template de page WordPress personnalisé (2 méthodes)
Comme nous l’avons vu, la création de templates de pages WordPress personnalisés vous donne plus de liberté sur l’apparence de votre site. Ce processus vous permet également de gagner du temps.
Heureusement, il existe différentes façons de créer des templates de page dans WordPress. Par exemple, vous pouvez en créer un manuellement et le télécharger sur votre site ou utiliser un plugin de construction de pages.
Examinons de plus près chaque méthode !
1. Créer manuellement un template de page
Si vous savez déjà comment créer un thème WordPress, vous pouvez opter pour l’approche manuelle. Cette méthode nécessite quelques connaissances en matière de codage et vous offre une grande flexibilité dans la conception de votre template personnalisé.
Important ! Dans ce tutoriel, nous allons créer et téléverser un fichier de modèle dans votre thème actuel. Nous vous recommandons de créer d’abord un thème enfant. De cette façon, vous ne perdez pas vos nouvelles modifications lorsque le thème parent sera mis à jour.
Étape 1 : Création d’un fichier modèle
Pour commencer, ouvrez l’éditeur de texte de votre choix et ajoutez cette ligne de code :
<?php /* Template Name: CustomPage */ ?>
Vous pouvez donner à votre template le nom que vous voulez. Toutefois, nous vous recommandons d’utiliser un nom identifiable.
Par exemple, si vous créez un modèle de page pour un type spécifique d’article de blog, comme les guides pratiques, vous pouvez l’appeler “Tutoriels”. De même, si vous créez un modèle qui exclut la barre latérale de votre thème, vous pouvez l’appeler “PageSansBarreLatérale”.
Une fois le code ajouté, enregistrez votre fichier sous un nom tel que “custompage.php”. Vous pouvez utiliser n’importe quel nom pour votre fichier modèle, mais il doit porter l’extension .php.
Étape 2 : Téléverser le fichier template sur votre site
Ensuite, vous devez télécharger ce fichier sur votre site. Pour ce faire, vous pouvez utiliser un client FTP (File Transfer Protocol) comme FileZilla.
Si c’est la première fois que vous utilisez un FTP, vous devrez entrer vos informations d’identification, y compris votre nom d’utilisateur et le nom d’hôte du serveur. Vous trouverez ces informations dans le tableau de bord de votre compte d’hébergement WordPress.
Une fois que vous avez connecté FileZilla à votre site, naviguez jusqu’au dossier wp-content/themes/ et ouvrez le dossier de votre thème enfant :
Ensuite, téléchargez le fichier du modèle que vous venez de créer dans ce dossier. Ce modèle devrait maintenant être disponible sur votre site internet.
Pour le confirmer, accédez à votre zone d’administration WordPress et créez une nouvelle page (ou ouvrez-en une existante). Dans le panneau Réglages, localisez la section Modèle et cliquez dessus pour afficher vos options :
Vous devriez voir votre nouveau modèle dans la liste. Cependant, si vous le définissez comme modèle et que vous cliquez sur Voir, vous obtiendrez une page blanche.
C’est parce que nous n’avons encore rien ajouté au fichier. Nous vous montrerons comment le personnaliser dans l’étape suivante.
Étape 3 : Personnalisation du fichier modèle
Tout d’abord, vous devez copier le modèle de page existant de votre thème. Pour ce faire, connectez-vous à votre site via FTP et accédez au dossier de votre thème actuel. Recherchez ensuite un fichier appelé page.php et ouvrez-le dans un éditeur de texte.
Ensuite, vous devez copier le code suivant dans le fichier page.php :
Lorsque vous avez terminé, ouvrez votre fichier de modèle de page personnalisé et collez ce code juste en dessous de la ligne suivante :
<?php /* Template Name: CustomPage */ ?>
Votre fichier de modèle doit maintenant ressembler à ceci :
Vous pouvez maintenant modifier votre fichier de modèle de page personnalisé. Par exemple, si vous souhaitez supprimer le pied de page du modèle, vous pouvez supprimer la ligne suivante :
<?php get_footer(); ?>
Vous pouvez également ajouter un code PHP personnalisé pour adapter le modèle à vos besoins. Lorsque vous avez terminé, enregistrez vos modifications.
Maintenant, si vous retournez à l’article ou à la page où vous avez appliqué le modèle et que vous cliquez pour le prévisualiser, vous devriez pouvoir voir vos nouvelles modifications.
2. Créer un template de page avec un plugin Page Builder
Ne vous inquiétez pas si vous n’avez pas de connaissances en codage. Il existe un moyen plus simple de créer vos propres templates, qui consiste à utiliser un outil de construction de pages.
Heureusement, plusieurs constructeurs de pages WordPress vous permettent de créer des designs personnalisés. Cette section examinera deux options populaires – Elementor et Beaver Builder.
Construire une page WordPress personnalisée avec Elementor
Elementor est livré avec un éditeur drag-and-drop qui facilite la construction et la personnalisation des pages de WordPress. Vous pouvez créer des templates personnalisés avec des widgets et les utiliser sur votre site web. Vous pouvez également choisir des templates Elementor prédéfinis et les ajuster à votre convenance.
Dans ce tutoriel, nous allons vous montrer comment construire un template de page WordPress de base avec Elementor. Vous pouvez utiliser la version gratuite du constructeur pour créer un design WordPress personnalisé et l’appliquer à des pages sélectionnées. Cependant, Elementor Pro offre plus d’options de personnalisation et de fonctionnalités.
Étape 1 : Conception du modèle
Une fois que vous avez installé et activé Elementor sur votre site web, naviguez vers Modèles et cliquez sur Ajouter un nouveau modèle :
Elementor vous demandera alors de sélectionner le type de modèle que vous souhaitez créer et de lui donner un nom :
Si vous utilisez la version gratuite, vous pouvez choisir entre Page, Section, Conteneur ou Page d’atterrissage. Pour créer des templates d’articles personnalisés, vous devez passer à la version Pro d’Elementor.
Lorsque vous êtes prêt, cliquez sur Créer un modèle. Cela lancera l’éditeur Elementor :
Vous trouverez sur le côté gauche une sélection d’éléments que vous pouvez faire glisser et déposer sur votre page. Toutefois, avant de commencer, vous voudrez peut-être modifier la mise en page de votre modèle.
Cliquez sur l’icône Réglages dans le coin inférieur gauche :
Vous pouvez ensuite choisir votre modèle de page dans la liste proposée. Par exemple, si vous sélectionnez Elementor Canevas, vous obtiendrez une page complètement vide :
Une fois que vous avez choisi votre mise en page, vous pouvez commencer à ajouter des éléments à votre page. Vous pouvez également utiliser un modèle existant comme base.
Pour accéder à ces templates Elementor, il suffit de cliquer sur l’icône du dossier :
Vous pouvez ensuite sélectionner un bloc ou une page complète :
Vous pouvez ensuite sélectionner n’importe quel élément de votre page pour en configurer les paramètres :
Lorsque vous êtes prêt, cliquez sur la flèche située à côté du bouton Publier et sélectionnez Enregistrer comme modèle :
Elementor vous demandera alors d’entrer un nom pour votre modèle. Ce modèle sera ensuite enregistré dans votre bibliothèque de templates.
Étape 2 : Appliquer le modèle à vos pages
Une fois que vous avez créé et enregistré votre modèle, vous pouvez l’utiliser sur n’importe quelle page conçue avec Elementor.
Pour commencer, cliquez sur Pages → Ajouter une page, puis sélectionnez le bouton Modifier avec Elementor :
Cela ouvrira votre nouvelle page dans l’éditeur Elementor :
Vous pouvez ensuite cliquer sur l’icône du dossier pour ouvrir la bibliothèque de modèles (comme indiqué précédemment) et rechercher votre modèle sous Mes modèles. Il vous suffit ensuite d’insérer votre modèle dans la page et de le personnaliser comme bon vous semble.
Notez que si vous utilisez Elementor Pro, vous aurez également accès au Constructeur de Thème :
Cette fonctionnalité vous permet de concevoir des éléments personnalisés, notamment des en-têtes, des pieds de page et des templates d’articles uniques, puis de configurer leurs conditions d’affichage.
Par exemple, si vous créez un modèle d’article WordPress avec le constructeur de thèmes, vous pouvez choisir de l’appliquer à tous vos articles.
Construire une page WordPress personnalisée avec Beaver Builder
Beaver Builder est un autre outil qui peut vous aider à créer des templates de pages personnalisés pour WordPress. Similaire à Elementor, ce plugin de construction de pages est livré avec un éditeur par glisser-déposer et une large sélection d’éléments appelés “modules”.
Beaver Builder vous permet également d’enregistrer vos créations en tant que modèles. Toutefois, cette fonctionnalité n’est disponible qu’avec la version premium du plugin.
Dans ce tutoriel, nous utiliserons le plugin premium pour vous montrer comment créer un template de page WordPress.
Étape 1 : Conception du modèle
Après avoir installé et activé le plugin dans votre tableau de bord WordPress, naviguez vers Beaver Builder → Templates et sélectionnez Ajouter :
Il vous sera ensuite demandé de choisir un nom pour votre design et de sélectionner un type de modèle :
Ensuite, cliquez sur Ajouter un template sauvegardé et sélectionnez Lancer Beaver Builder. Vous accéderez ainsi au constructeur :
Vous pouvez ensuite commencer à créer votre modèle. Vous pouvez faire glisser et déposer des éléments de l’onglet Modules, puis cliquer sur eux pour configurer leurs paramètres.
Vous pouvez également utiliser un modèle Beaver Builder :
Lorsque vous êtes satisfait de vos modifications, cliquez sur le bouton Terminé dans le coin supérieur droit. Sélectionnez ensuite Publier.
Étape 2 : Appliquer le modèle à vos pages
Une fois que vous avez créé votre modèle, vous pouvez l’appliquer à n’importe quelle page de votre site web. Commencez par ouvrir votre page pour l’éditer (ou en créer une nouvelle), puis cliquez sur Lancer Beaver Builder :
Dans l’onglet Templates, sélectionnez Templates enregistrés et choisissez votre modèle :
Beaver Builder va maintenant ajouter le modèle à votre page. Vous pouvez ensuite y apporter toutes les modifications que vous souhaitez. Lorsque vous êtes prêt, cliquez sur Terminé, puis sélectionnez Enregistrer le brouillon ou Publier.
Conclusion
Apprendre à créer un template de page WordPress peut vous aider à économiser du temps et des efforts. Ce processus vous permet également d’ajuster facilement la conception de votre site pour qu’il réponde mieux à vos besoins. Vous pouvez créer une variété de mises en page, y compris des templates WordPress pour un seul article.
Dans cet article, nous avons examiné deux façons principales de créer des templates de pages personnalisés pour WordPress :
- Créez un fichier modèle et téléchargez-le dans le dossier de votre thème à l’aide d’un outil comme FileZilla.
- Utilisez un plugin de construction de pages comme Elementor ou Beaver Builder.
Ces deux méthodes offrent une grande liberté de personnalisation, vous pouvez donc choisir celle avec laquelle vous vous sentez le plus à l’aise.
Avez-vous des questions sur la création d’un modèle de page WordPress personnalisé ou sur la création d’un site web ? Faites-nous en part dans la section des commentaires ci-dessous !
En savoir plus sur les techniques d'experts WordPress
Comment débuter le développement WordPress
Guide complet de WordPress
Comment créer des widgets personnalisés sur WordPress