Voulez-vous créer un modèle de page personnalisé

Vous conviendrez probablement que créer des sites Web à l’aide de WordPress est relativement simple.

Installez un thème WordPress, adaptez le contenu à vos besoins et voilà, votre site Web est prêt à être lancé !

Avec une structure de modèle prédéfinie, tout ce que vous avez à faire est de remplacer le texte et les images

Cependant, que se passe-t-il si vous souhaitez modifier la structure de mise en page d’une page particulière ? Que se passe-t-il si vous souhaitez créer une mise en page unique différente de celle

Heureusement, WordPress vous offre la possibilité de créer des mises en page personnalisées. Vous pouvez les utiliser de manière unique ou comme modèle pour plusieurs pages.

Et le meilleur, c’est que vous n’avez même pas besoin de connaître HTML, CSS ou PHP !

Alors, comment créer un modèle de page personnalisé

Découvrons-le !

Qu’est-ce qu’un modèle de page personnalisée WordPress ?

Comme son nom l’indique, un modèle de page personnalisé

En utilisant un modèle de page personnalisé, vous pouvez appliquer une mise en page différente du reste des pages de votre site.

Vous souhaitez créer un modèle de page

Tout cela peut être réalisé en utilisant un modèle de page personnalisé.

Non seulement un modèle de page peut être appliqué pour afficher du contenu dynamique sur une page, mais il peut également être appliqué à une section de page ou même à une classe particulière de pages.

L’apparence de vos pages est contrôlée

Mais que se passe-t-il lorsque vous avez un modèle de page personnalisé

C’est là que la hiérarchie des modèles de page entre en jeu.

Hiérarchie des modèles de page

Chaque fois qu’une demande est envoyée pour consulter votre site Web, WordPress détermine quel contenu doit être affiché et comment cette partie spécifique du site Web ou de la page doit être rendue.

La hiérarchie des modèles WordPress parcourra une liste de fichiers de modèles de page et sélectionnera celui qui convient le mieux.

Généralement, la hiérarchie des pages ressemble à ceci :

• Modèle de page : WordPress recherche le modèle personnalisé que vous avez attribué à la page et l’utilise
• page-{slug}.php : Si vous n’avez pas attribué de modèle personnalisé, WordPress recherche un modèle contenant le slug de la page et l’utilise
• page-{id}.php : Si un modèle avec le slug de la page n’est pas trouvé, WordPress recherche ensuite un modèle avec l’ID

de la page.

• page.php : Si un modèle avec l’ID de la page n’est pas trouvé, WordPress utilise le modèle
• singular.php : Si le fichier page.php est introuvable, quel que soit le type de publication, WordPress utilise le modèle du thème destiné aux publications uniques
• index.php : WordPress utilise le fichier index.php

Maintenant que nous avons une bonne idée de la façon dont WordPress choisit un modèle, comprenons pourquoi nous pourrions avoir besoin d’un modèle de page personnalisé

Pourquoi pourriez-vous avoir besoin d’un modèle personnalisé ?

Un modèle de page personnalisé vous permet de personnaliser un site WordPress de plusieurs manières.

L’utilisation d’un modèle de page personnalisé vous permet d’afficherdifférents types de contenu sur différentes pages. Si vous envisagez de créer plusieurs pages, un modèle personnalisé est votre meilleur choix.

Bien que la plupart des thèmes proposent une sélection de modèles prédéfinis, certains ne le font pas, ce qui limite votre flexibilité de conception.

Examinons quelques cas où vous pourriez avoir besoin d’un modèle de page personnalisé.

Pages d’entonnoir de vente

Une page d’entonnoir de vente est une page autonome de votre site WordPress conçue

Il peut s’agir de s’inscrire à un webinaire, d’acheter quelque chose, de s’inscrire pour un essai gratuit ou de télécharger un livre électronique.

Si vous utilisez WordPress pour votre site, vous pouvez créer rapidement un entonnoir de vente avec un modèle de page personnalisé.

Une fois que vous avez sélectionné un modèle de page personnalisé, vous pouvez le personnaliser pour l’adapter à l’apparence de votre site. Vous pouvez également utiliser un modèle de page de destination prédéfini pour créer votre entonnoir.

Vous aurez également besoin de WooCommerce et CartFlows pour créer un entonnoir de vente avec WordPress.

Pages de destination

Une page de destination est une page autonome conçue pour convertir les visiteurs en prospects, comme les pages d’entonnoir.

Une page de destination typique n’a pas de barres latérales, d’en-tête ou de pied de page pour réduire les distractions. Tout ce que vous avez est une page pleine largeur qui comprend du texte, un formulaire de capture de leads et un appel à l’action.

Un modèle de page personnalisé est un excellent moyen de créer une page de destination.

Si vous utilisez l’éditeur de blocs Gutenberg, vous pouvez personnaliser n’importe quel bloc et supprimer celui dont vous n’avez pas besoin.

De nombreuses pages de destination utilisent des boutons d’appel à l’action, et le bloc Boutons vous permettra d’ajouter un bouton à vos pages. Un bloc d’abonnement vous aidera également à collecter des prospects auprès des visiteurs.

Si votre site Web vend un produit, votre page de destination doit être conçue en gardant à l’esprit les objectifs de ce public spécifique.

Une page de compression est un bon choix si vous essayez de capturer des adresses e-mail. Une page de remerciement augmentera la satisfaction client. Une page de destination du webinaire vise à augmenter les inscriptions.

Vous voyez l’idée.

Pages avec des utilisations différentes de celles des pages « principales »

Les modèles de pages personnalisés peuvent créer à peu près toutes les pages dont vous pourriez avoir besoin.

En termes simples, un modèle de page personnalisé fonctionne bien lorsque vous souhaitez créer une page différente du reste des pages de votre site Web.

Une fois que vous avez créé un modèle, vous pouvez le réutiliser autant de fois que vous le souhaitez sans avoir à en créer un autre à partir de zéro.

Utiliser des modèles de démarrage pour créer un modèle de page personnalisé

La création d’un modèle de page personnalisé est très simple si vous utilisez notre thème Astra et nos modèles de démarrage.

Starter Templates est une bibliothèque de modèles prédéfinis qui fonctionnent pour presque tous les créneaux. Pour le bien de cet article, nous importerons un modèle de démarrage pour le générateur de pages Elementor.

Pour commencer, rendez-vous sur Pages > Ajouter un nouveau et nommez votre modèle.

Sous l’onglet Template, sélectionnez l’option Elementor Canvas. De cette façon, nous disposons d’une toile entièrement vierge avec laquelle jouer.

Ensuite, cliquez sur le bouton Modifier avec Elementor.

Parmi les options proposées, cliquez sur Modèles de démarrage.

Nous supposons que vous avez installé des modèles de démarrage sur votre site WordPress.

Si c’est le cas, vous remarquerez une gamme de modèles uniques parmi lesquels choisir.

Bien que vous puissiez sélectionner n’importe quel modèle de votre choix, nous allons rechercher un modèle de « page de destination » à l’aide du champ de recherche fourni.

En cliquant sur le modèle, vous voyez les différentes pages qui l’accompagnent.

Si tout semble bon, continuez et cliquez sur le bouton Importer un modèle.

Cela charge le modèle sur votre page.

En règle générale, nous cliquons immédiatement sur le bouton de publication. Mais avant de faire cela, cliquez surla flèche à côté du bouton de publication.

Vous trouvez deux options : enregistrer un brouillon ou enregistrer en tant que modèle.

Cliquez sur l’option « Enregistrer en tant que modèle ».

Vous serez invité à saisir un nom pour votre modèle. Cliquez sur Enregistrer lorsque vous avez terminé.

Votre modèle sera maintenant enregistré sous l’onglet Mes modèles.

La prochaine fois que vous souhaiterez utiliser ce modèle, cliquez sur le lien Insert.

C’est aussi simple que de créer un modèle de page personnalisé à l’aide des modèles de démarrage !

Créer un modèle de page personnalisé à l’aide d’Elementor

Nous allons maintenant créer un modèle de page personnalisé en utilisant Elementor à partir de zéro.

Accédez à Pages > Ajouter un nouveau et nommez votre modèle.

Ensuite, cliquez sur Modifier avec Elementor.

Bien que vous puissiez créer une page à partir de zéro à l’aide de sections et des différents widgets proposés, nous en créerons une plus rapidement en utilisant l’un des nombreux modèles prédéfinis.

Cliquez sur l’icône du dossier pour ajouter un modèle.

Cela ouvre une bibliothèque entière de modèles que vous pouvez utiliser. Il existe un modèle pour presque tous les créneaux, des agences et consultants aux cliniques dentaires et salons de beauté.

Vous ne souhaitez pas utiliser de modèles de page ? Aucun problème! Vous pouvez également utiliser des blocs prédéfinis.

Vous pouvez concevoir un modèle de page personnalisé à partir de zéro en utilisant une gamme de blocs. Incluez des blocs sur votre page pour diverses catégories, telles que à propos, contact, appel à l’action, clients ou tout ce que vous voulez.

Nous sélectionnerons un modèle sous l’onglet Pages.

Cliquez et prévisualisez un modèle de votre choix.

Si cela correspond à vos besoins, continuez et cliquez sur Insérer.

Si c’est la première fois que vous vous connectez à la bibliothèque de modèles, vous serez peut-être invité à vous connecter.

Cliquez sur Commencer et terminez le processus de connexion simple.

Une fois connecté avec succès, vous serez invité à confirmer le processus d’importation.

Cliquez sur Oui pour continuer.

Le modèle sera maintenant inséré sur votre page.

Ensuite, cliquez sur la flèche adjacente au bouton Publier, comme indiqué ci-dessous.

Parmi les options proposées, cliquez sur Enregistrer en tant que modèle.

Vous serez invité à nommer votre modèle.

Saisissez un nom et cliquez sur Enregistrer.

Votre modèle de page personnalisé est désormais ajouté à la liste Mes modèles.

La prochaine fois que vous souhaiterez utiliser un modèle de page personnalisé, cliquez sur l’onglet Mes modèles et insérez votre modèle.

Et c’est aussi simple que de créer un modèle personnalisé à l’aide d’Elementor !

Créer un modèle de page personnalisé à l’aide de Gutenberg

Créons maintenant un modèle de page personnalisé à l’aide de l’éditeur de blocs Gutenberg.

L’éditeur Gutenberg facilite grandement la création de pages à l’aide de blocs. Vous souhaitez ajouter un élément à votre page ? Ajoutez simplement un bloc.! C’est aussi simple que ça !

Gutenberg rend les choses encore plus faciles en vous permettant de créer des blocs réutilisables.

Une fois que vous êtes satisfait d’un bloc que vous avez créé, vous pouvez l’ajouter à votre collection de blocs réutilisables.

De cette façon, vous pouvez réutiliser ce bloc sur n’importe quelle page ou publication sur votre site Web.

Vous pouvez toujours installer le plugin Ultimate Addons for Gutenberg (UAG) pour certainsblocs supplémentaires.

UAG alimente votre éditeur Gutenberg avec des blocs puissants qui vous permettent de créer des sites Web uniques et extraordinaires sans écrire une seule ligne de code.

Une fois que vous avez terminé de créer votre page, créez un bloc réutilisable qui comprend tous les blocs que vous venez de créer.

Vous pouvez le faire en cliquant à l’intérieur de n’importe quel bloc et en utilisant le raccourci clavier CTRL+A (ou CMD+A pour les utilisateurs Mac), vous pouvez sélectionner tous les blocs.

Ensuite, cliquez sur « Ajouter aux blocs réutilisables.

Nommez votre bloc réutilisable, puis cliquez sur Enregistrer.

Vous souhaitez ajouter votre modèle à une nouvelle page ? Recherchez votre bloc réutilisable et insérez-le.

Simple, n’est-ce pas ?

Créer manuellement un modèle de page personnalisé

Nous avons laissé cette méthode pour la fin, simplement parce qu’elle implique du codage.

Bien que les méthodes que nous avons abordées précédemment devraient parfaitement fonctionner, vous pouvez également utiliser cette méthode pour créer un modèle de page personnalisé si vous êtes à l’aise avec l’écriture de code.

Vous aurez également besoin de vos informations d’identification FTP ou d’un accès au gestionnaire de fichiers sur votre compte d’hébergement pour télécharger des fichiers sur votre site en direct.

Commencez

<?php /* Nom du modèle : MyCustomTemplate */ ?>

Cette ligne de code indique à WordPress qu’il s’agit d’un fichier modèle. Vous pouvez donner n’importe quel nom à votre modèle.

Une fois cela fait, enregistrez le fichier sur votre bureau avec une extension .php. Nous avons conservé le fichier sous le nom mycustomtemplate.php.

Ensuite, nous devons télécharger ce fichier sur le site en direct. Vous pouvez utiliser un client FTP tel que FileZilla ou le gestionnaire de fichiers de votre panneau de contrôle d’hébergement.

Le fichier doit être téléchargé avec le dossier du thème actuel, que vous pourrez localiser

Une fois que vous avez téléchargé le fichier avec succès, accédez à votre tableau de bord WordPress et ajoutez une nouvelle page.

Sous Template, sur le côté droit de votre éditeur, vous trouverez le modèle que vous venez de télécharger.

Sélectionnez le modèle personnalisé et cliquez sur Publier.

Étant donné que nous n’avons qu’une seule ligne de code sur notre page de modèle, tout ce que vous verrez actuellement est un écran vide.

Le moyen le plus simple de démarrer votre modèle est d’utiliser le code existant et de l’adapter à vos besoins.

Voici à quoi ressemble le code du fichier page.php d’Astra,

<?php si ( astra_page_layout() == 'barre latérale gauche' ) : ?>
    <?php get_sidebar(); ?>
<?php endif ?>
    <div id="primaire" <?php astra_primary_class(); ?>>
        <?php astra_primary_content_top(); ?>
        <?php astra_content_page_loop(); ?>
        <?php astra_primary_content_bottom(); ?>
    </div><!-- #primary -->
<?php if ( astra_page_layout() == 'right-sidebar' ) : ?>
    <?php get_sidebar(); ?>
<?php endif ?>
<?php get_footer(); ?>

Voulez-vous supprimer la barre latérale ? Supprimez simplement la ligne suivante <?php get_sidebar(); ?>.

Une fois que vous avez écrit votre code personnalisé, téléchargez le modèle sur votre site en ligne et utilisez-le sur votre site WordPress.

Comment sélectionner un modèle de page
Changer un modèle de page

Vous pouvez sélectionner un modèle de page pour une nouvelle page que vous créez ou pour une page existante.

Pour sélectionner un modèle de page personnalisé, rendez-vous sur Pages > Ajouter un nouveau et vous trouverez la section modèle.

Sélectionnez le modèle souhaité parmi les options proposées

Vous ne remarquerez la liste des modèles que lors de la création ou de la modification d’une page. Ces options ne seront pas disponibles si vous publiez un message.

FAQ sur les modèles de pages personnalisées

Voyons maintenant quelques questions fréquemment posées liées aux modèles de pages personnalisés.

Créer un modèle de page personnalisé
Les thèmes WordPress et WordPress rendent l’ensemble du processus de création de page vraiment simple.

Une fois que vous avez installé un thème, vous pouvez sélectionner un modèle

Cependant, il peut arriver que vous souhaitiez utiliser un modèle différent du reste des pages de votre site Web. Peut-être une page sans barre latérale, ni en-tête ni pied de page. Vous souhaiterez peut-être avoir un modèle pour toutes vos pages de destination ou même un entonnoir de vente.

Heureusement, créer un modèle de page personnalisé

Et juste au cas où vous souhaiteriez créer un modèle de page manuellement en écrivant du code, nous avons également couvert cela !

À vous maintenant. Comment créer un modèle de page

Post Views: 138