Comment créer un modèle de publication de blog Elementor personnalisé (guide facile)
Publié: 2022-03-10Êtes-vous à la recherche du didacticiel le plus simple sur la création d'un modèle de publication de blog Elementor personnalisé?
Les blogs sont l'un des moyens les plus populaires et les plus efficaces de faire connaître votre produit. Cependant, si vous souhaitez tirer le meilleur parti du marketing de contenu, vous devez vous assurer que la page de votre blog a un aspect captivant et contient les bonnes informations.
Pour rendre votre article de blog attrayant, vous devez créer votre propre modèle de blog personnalisé. Et vous pouvez obtenir un modèle de publication de blog exceptionnel pour engager votre public à l'aide d'Elementor. Vous pouvez créer une page de blog personnalisée Elementor à partir de zéro et en créer une à l'aide de modèles prédéfinis.
Dans cet article, vous apprendrez à créer un modèle de publication de blog Elementor en utilisant deux méthodes de la manière la plus simple possible. Alors, continuez à lire…
Plugins que vous devez installer pour créer un modèle de publication de blog Elementor personnalisé
Pour créer un article de blog dans WordPress avec le constructeur de pages Elementor sans effort, vous aurez besoin des deux
- Élémentaire (Gratuit)
- et Elementor Pro.

Comment créer un modèle de page de blog personnalisé Elementor à partir de zéro
Elementor Pro fournit tous les widgets nécessaires dont vous aurez besoin pour créer un superbe modèle de publication de blog personnalisé à partir de rien. Suivez simplement les étapes ci-dessous pour créer votre modèle de publication Elementor unique :
Étape 1 : Créer un nouveau modèle de blog unique
Tout d'abord, vous devez créer un modèle de blog unique. Pour cela, accédez au tableau de bord WordPress, puis accédez à Modèles ⇒ Ajouter un nouveau

et cliquez sur le bouton Ajouter nouveau . Une fois la nouvelle fenêtre ouverte, sélectionnez Single Post comme type de modèle dans la liste déroulante, fournissez un nom de votre choix puis cliquez sur Créer un modèle .

Vous devriez maintenant voir les mises en page prédéfinies (nous verrons comment les utiliser plus tard). Puisque nous allons créer un modèle de blog à partir de zéro, cliquez sur le bouton croix dans le coin supérieur droit pour fermer cette fenêtre.
Étape 2 : Sélectionnez une structure/mise en page pour le modèle d'article de blog
Maintenant, vous devez choisir une structure pour votre modèle de blog, il est recommandé de ne pas utiliser toute la largeur d'une page car il devient difficile pour l'utilisateur de la lire. Pour choisir une structure pour votre modèle de page de blog personnalisé Elementor, cliquez sur l'icône + et sélectionnez celle que vous aimez et cliquez simplement sur la structure pour l'insérer.

Remarque : Pour voir à quoi ressemblera un blog avec le modèle que vous créez, sélectionnez un blog existant dans l'option d' aperçu du contenu dynamique . Pour définir cela, cliquez sur l'option Paramètres dans le coin inférieur gauche.
Ensuite, choisissez Publier dans la liste déroulante Aperçu du contenu dynamique , tapez le nom du blog que vous souhaitez sélectionner dans la deuxième liste déroulante ci-dessous. Enfin, cliquez sur Appliquer et prévisualiser .

Étape 3 : Ajouter un widget d'image en vedette et personnaliser les options de style d'image
Une fois que vous avez la mise en page, dans la barre d'édition de gauche, recherchez le widget Featured Image. Après avoir trouvé le widget, faites-le glisser et déposez-le à l'emplacement souhaité.

Une fois le widget chargé, personnalisez la taille de l'image, l'alignement, la légende, le lien et l'option lightbox.

Pour modifier les paramètres de style, accédez à l' onglet Style . Ici, vous pouvez modifier la hauteur, la largeur, l'opacité, la bordure, le rayon, etc. de l'image.

Vous pouvez également consulter notre blog sur Comment créer un méga menu avec Elementor
Étape 4 : Ajoutez et personnalisez le widget Elementor Post Info
Après l'image de la fonction, vous devez afficher les informations relatives à la publication que vous pouvez faire avec le widget Informations sur la publication . Tout comme l'image sélectionnée, recherchez d'abord le widget Post Info , puis glissez-déposez simplement sous le widget Featured Image.

Dans l'onglet Contenu de l'éditeur Elementor, vous pouvez définir la mise en page sur Par défaut ou En ligne. Vous pouvez modifier/supprimer les options Auteur, Date, Heure et Commentaires . Vous pouvez également ajouter un champ personnalisé au widget Post Info en cliquant sur le bouton + ADD NEW.

Encore une fois, passez à l'onglet Style pour personnaliser les paramètres de style tels que l'espace entre les listes, l'alignement, la couleur et la taille de l'icône, la couleur du texte et la typographie.

Étape 5 : Faites glisser et déposez le widget Titre de l'article et personnalisez-le
Maintenant, recherchez le widget Titre de la publication et faites glisser et déposez sous le widget d'informations sur la publication.

Vous pouvez personnaliser la taille, la balise HTML et l'alignement de la balise Titre du message.

Dans l'onglet Style, vous trouverez des options pour personnaliser la couleur du texte, la typographie, le contour du texte, l'ombre du texte et le mode de fusion.

Étape 6 : Ajoutez et personnalisez le widget Publier du contenu
Maintenant, faites glisser et déposez le widget de contenu de publication . Le widget de contenu de publication d'ElementsKit représente le corps (contenu principal) de la publication de blog.

Étape 7 : Faites glisser et déposez le widget Icônes sociales pour ajouter une option de partage social
Après le contenu de la publication, ajoutez le widget Social Icons par glisser-déposer. Les icônes sociales fourniront des options pour partager votre blog sur différentes plateformes sociales.
Vous pouvez ajouter/supprimer autant d'icônes sociales que vous le souhaitez. De plus, vous pouvez personnaliser la forme des icônes, le nombre de colonnes qu'elles doivent afficher et l'alignement. Vous pouvez également personnaliser l'icône de la plateforme sociale, la couleur et le lien pour chacune des icônes sociales.

Accédez à l'onglet Style pour modifier la taille, la couleur, le remplissage, l'espacement et le type de bordure de l'icône.

Étape 8 : Ajoutez le widget Author Box et personnalisez les paramètres du widget
Recherchez Author Box et faites glisser et déposez le widget après les icônes sociales. Vous pouvez également ajouter un auteur personnalisé si vous le souhaitez à partir de la liste déroulante des sources. Vous pouvez choisir d' afficher/masquer l'image de profil, le nom d'affichage et la biographie . Vous pouvez également personnaliser d'autres paramètres tels que la balise HTML, le lien, la mise en page, l'alignement.


Accédez à l'onglet Style pour personnaliser les options telles que la taille de l'image, la bordure, la couleur et la typographie du nom de l'auteur, de la biographie, etc.

Étape 9 : Ajouter un widget de navigation de publication pour l'option de pagination
Le widget Elementor Post Navigation offrira des options de navigation aux lecteurs afin qu'ils puissent passer à différents blogs. Pour ajouter le widget de navigation des articles, comme avant, recherchez sur l'éditeur, puis faites glisser et déposez après le widget de la zone d'auteur.
Vous pouvez afficher ou masquer l'étiquette de pagination ou le signe fléché. Vous obtenez environ 8+ options de conception pour les flèches. Vous pouvez également personnaliser le texte de niveau précédent et suivant.

Vous pouvez modifier la couleur et la typographie de l'étiquette, du titre, de la flèche et des bordures pour les vues normales et survolées.

Étape 10 : Faites glisser et déposez le widget Articles pour afficher les articles associés
Pour présenter les publications associées, nous allons utiliser le widget Elementor Posts . Alors, faites glisser et déposez le widget de publication après le widget de navigation de publication. Avec ce widget, vous pouvez modifier la couleur de peau, définir le nombre de colonnes, le nombre de publications par page, la position de l'image et bien d'autres paramètres. Vous pouvez également modifier les différents styles de mise en page, de boîte, d'image et de contenu.

Étape 11 : Ajouter un widget de commentaires de publication
Pour donner à vos utilisateurs la possibilité de commenter vos messages, vous devez ajouter les widgets de commentaires de messages. Recherchez le widget Posts Comments et glissez-déposez sous le widget Posts.


Étape 12 : Mettre à jour et voir le modèle de page de blog personnalisé Elementor
Maintenant que tout le design est terminé, cliquez sur le bouton de mise à jour . Si la fenêtre des paramètres de publication s'affiche, cliquez sur Enregistrer et fermer.
Voici l'aperçu du modèle de publication de blog Elementor personnalisé que nous venons de créer.

Si vous avez trouvé la méthode décrite ci-dessus trop longue, vous pouvez opter pour la méthode mentionnée ci-dessous où vous n'avez pas à créer et à concevoir chaque section à partir de zéro.
Vous pouvez également consulter notre blog sur Comment ajouter un formulaire en plusieurs étapes dans Elementor en 5 étapes faciles
Comment créer la page de publication unique à l'aide du modèle Elementor prédéfini
Si vous envisagez d'utiliser un modèle prédéfini pour votre page de blog personnalisée Elementor, vous pouvez le faire en seulement 3 étapes. Vérifions comment :
Étape 1 : Créer un nouveau modèle d'article de blog unique à partir du tableau de bord
Comme pour la première méthode, vous devez créer un nouveau modèle de blog unique. Pour plus de détails sur la façon de créer le nouveau modèle , faites défiler un peu et vérifiez la première étape de la première méthode (comment créer un modèle de blog à partir de zéro).

Étape 2 : Choisissez un modèle de publication unique Elementor prédéfini
Une fois que vous avez cliqué sur Créer un modèle, vous verrez la fenêtre de la bibliothèque Elementor avec de nombreux modèles de publication uniques personnalisés. Ici, vous pouvez choisir l'un des blocs de poteau unique que vous aimez. Survolez le modèle de votre choix, cliquez sur insérer.

Étape 3 : Choisissez un modèle de publication unique Elementor prédéfini
Une fois le modèle chargé, cliquez sur le bouton Publier pour enregistrer tous les nouveaux modèles de blog.
Voici un aperçu final d'un article de blog utilisant un article de blog Elementor utilisant un modèle de publication unique prédéfini.

Comment créer une page de derniers messages Elementor avec ElementsKit
Maintenant que vous avez un modèle de publication unique attrayant, il est temps de créer une page de liste de blogs personnalisée afin que tous vos blogs soient affichés de manière apaisante et conviviale. Voyons comment vous pouvez créer un dernier message Elementor personnalisé avec ElementsKit.
Étape 1 : Installer et activer ElementsKit
Pour créer une superbe page de liste de blogs, avec le générateur de pages Elementor, vous aurez besoin d'ElementsKit. ElementsKit est un plugin tout-en-un pour Elementor avec plus de 85 widgets et modules pour rendre le développement Web plus facile que jamais.

Étape 2 : Activer le widget associé à la liste des publications
Une fois activé, vous devez activer le widget lié à la publication pour créer la page de la liste des publications. ElementsKit fournit un certain nombre de widgets pour afficher vos listes de blogs, notamment les articles de blog, la grille de publication, la liste de publications, le widget d'onglet de publication, etc. Vous pouvez activer le widget que vous souhaitez utiliser.

Découvrez comment créer une belle navigation par défilement d'une page Elementor à l'aide d'ElementsKit
Étape 3 : Ajoutez le widget et personnalisez-le
Maintenant, allez sur la page de la liste des blogs, recherchez le widget et glissez-déposez simplement. Une fois le widget chargé, vous pouvez personnaliser les paramètres associés pour personnaliser la page de votre liste de blogs. Voyons à quoi ressemblera une page de liste de blogs avec quelques-uns des widgets ElementsKit et leurs options de personnalisation.
Billets de blog :
À l'aide du widget Blog Post, vous pouvez afficher vos blogs au format Bloc, Grille avec pouce et Grille sans pouce . Vous pouvez également définir le nombre de messages à afficher par ligne, activer/désactiver la pagination et bien d'autres options. Pour plus de détails, consultez notre blog sur la façon d'afficher les articles de blog récents.

Grille de publication :
Avec le plugin de grille de publication, vous pouvez personnaliser les blogs de catégorie que vous souhaitez afficher dans votre liste de blogs. Vous pouvez également choisir le nombre de messages à afficher et les numéros de colonne que chaque ligne doit avoir. Pour plus de détails, consultez notre documentation.

Widget d'onglet de publication
Avec un widget Post Tab , vous obtenez toutes les options de personnalisation comme Post Grid ainsi qu'un onglet de catégorie supplémentaire. Avec cette option, les utilisateurs peuvent simplement survoler n'importe quel onglet de catégorie et voir uniquement les blogs de cette catégorie particulière.

Une fois que vous avez choisi votre widget et fait la personnalisation selon votre choix, cliquez sur le bouton de mise à jour pour publier. Vous devriez maintenant avoir une page qui affiche les derniers messages récents d'Elementor de manière attrayante.

Derniers mots
Nous avons fait de notre mieux pour vous fournir un tutoriel simple sur la façon de créer un modèle de publication de blog Elementor personnalisé de deux manières. Nous espérons que vous avez trouvé le blog utile pour créer votre modèle de blog Elementor personnalisé. Vous pouvez suivre les étapes et modifier les mises en page ainsi que les conceptions selon votre choix.
Et n'oubliez pas de donner une touche extraordinaire à votre page de liste de blogs avec les widgets ElementsKit. ElementsKit est le complément parfait à Elementor, prenez le temps de découvrir tous les widgets incroyables que cet addon a à offrir.