Comment afficher les articles de blog sur une chronologie dans Elementor

Articles de blog affichés sous forme de cartes le long d’une chronologie verticale

Principaux points à retenir

  • Une chronologie de publication Elementor place les articles de blog publiés le long d'une ligne verticale dans l'ordre des dates, et elle se met à jour d'elle-même à chaque fois qu'un nouvel article est publié.
  • Elementor et Elementor Pro n'ont pas de widget de chronologie, donc une chronologie de publication nécessite un addon ou un modèle de boucle personnalisé conçu avec CSS.
  • Le type Post Timeline dans le widget Master Addons Timeline fait partie de Master Addons Pro et est sélectionné avec le contrôle Timeline Type dans l'onglet Contenu.
  • La requête Post Timeline comporte des publications par page, des commandes postales, des commandes ultérieures avec neuf choix, une catégorie, un filtre par étiquette, un auteur, des publications à exclure et un décompte des publications décalées.
  • Chaque carte Post Timeline peut afficher le titre de la publication, l'image présentée, un extrait avec une longueur définie et un bouton Lire la suite, et Activer les liens rend l'ensemble de la carte cliquable.
  • Les chronologies des publications dans le widget Master Addons sont uniquement verticales, tandis que la disposition horizontale du carrousel est réservée aux éléments manuscrits de la chronologie personnalisée.

Une chronologie de publication Elementor transforme vos archives de blog en une ligne datée : le dernier article en haut, chacun étant une carte avec son titre, son image et son extrait. Élémenteur n'a pas de widget pour cela, donc les étapes ci-dessous utilisent le type Post Timeline du Widget de chronologie Master Addons(en), qui est une fonctionnalité Pro.

Ce guide couvre les paramètres de requête, les filtres, ce que chaque carte montre et comment la styliser Il couvre également quand une grille de la Widget blog vous servirait mieux qu'un calendrier.

Qu'est-ce qu'un chronologie de publication et quand en utiliser un

Une chronologie de publication est une chronologie dynamique dont les entrées proviennent de vos publications WordPress au lieu des éléments que vous tapez à la main Publiez une publication et elle apparaît sur la ligne Personne n'a à modifier la page.

Cela en fait un bon choix pour le contenu où la date est le point :

  • Actualités et communiqués de presse de l'entreprise
  • Notes de publication, où chaque publication est une version
  • Un agenda de projet ou un journal de construction
  • L'événement revient tout au long d'une saison

C'est un ajustement plus faible pour un index de blog ordinaire Les lecteurs là-bas scannent les sujets, et une grille affiche plus de publications par écran.

Comment construire une chronologie de publication dans Elementor

Vous avez besoin d'Elementor, de Master Addons Pro et d'au moins quelques articles publiés avec des images en vedette. Ensuite, il faut cinq étapes.

Étape 1 : définissez le type de chronologie sur la chronologie de publication

Modifier la page avec Elementor, recherchez dans le panneau du widget Chronologie et faites-le glisser Dans l'onglet Contenu, ouvrez le Chronologie section et changement Type de chronologie de la chronologie personnalisée à Chronologie des publications. Les exemples d'éléments disparaissent et vos derniers messages prennent leur place.

Widget Elementor Timeline avec le type de chronologie défini sur Post Timeline, affichant les articles de blog le long d'une ligne verticale
Une fois la chronologie des publications sélectionnée, le panneau échange la liste des éléments contre des contrôles de publication, de vignette, de date et de requête.

La baisse du style de chronologie a disparu à ce stade. Une chronologie de publication est toujours verticale.

Étape 2 : Définissez la requête

Faites défiler la même section vers les contrôles de requête Ceux-ci décident quels messages se chargent et dans quel ordre.

ContrôleCe qu'il fait
Messages par pageCombien de publications la chronologie montre
Post-commandeDescendant (le plus récent en premier) ou Ascendant
Commandez parAucun, pièce d'identité, auteur, titre, nom, date, dernière modification, aléatoire ou nombre de commentaires
Compte de postes décalésSaute autant de messages depuis le début de la liste
Ignorer Sticky?Empêche les poteaux collants de sauter vers le haut

Pour une chronologie, laissez Order By allumé dater. L'ordre aléatoire ou Titre brise la seule chose qu'une chronologie promet, qui est l'ordre dans le temps Utilisez Ascending quand l'histoire doit se lire depuis le début, comme un journal de projet.

Le nombre de messages décalés est pratique lorsqu'un message vedette se situe déjà au-dessus de la chronologie. Réglez-le sur 1 et la chronologie commence à partir du deuxième message.

Étape 3 : Filtrer par catégorie, balise ou auteur

Sous les paramètres de commande se trouvent quatre filtres : Catégorie, Filtrer par balise, Auteur et Messages à exclure.

Contrôle des requêtes Post Timeline dans Elementor : Posts Per Page, Post Order, Order By, Category, Filter By Tag, Author et Posts to Exclude
Les contrôles de requête et de filtre Laisser les filtres vides pour charger les publications de tout le blog.

Un filtre de catégorie est le moyen habituel de construire une chronologie focalisée Mettez les publications de version dans une catégorie “Releases”, sélectionnez-la ici, et le widget devient un journal des modifications qui s'écrit lui-même Les publications à exclure suppriment les publications uniques qui n'ont pas leur place, comme une annonce dont vous ne voulez pas sur la ligne.

Étape 4 : Choisissez ce que montre chaque carte

Le haut de la section contrôle le contenu de la carte.

  • Afficher le titre, avec Titre Lien et un Étiquette de titre. H2 est la valeur par défaut. Choisissez un niveau inférieur si la chronologie se situe sous un H2 qui lui est propre.
  • Afficher l'image et Résolution d'image pour l'image en vedette.
  • Date Format et Temps Format pour la date à côté de chaque point.
  • Extrait Longueur, Type d'extrait et Lire la suite Texte pour le résumé et le bouton.
  • Activer les liens fait que toute la carte soit liée au message.

Activez soit les liens d'activation, soit le lien de titre, pas les deux. Un lien à l'intérieur d'une carte liée n'est pas HTML et le panneau en avertit sous le commutateur.

Étape 5 : Stylez les poteaux et les cartes

Aller à l'onglet Style. Le Postes styles de section ce qui est spécifique à une chronologie de publication : couleur du titre, typographie et espacement des titres, couleur de l'extrait et bouton Lire la suite avec typographie, remplissage, rayon de bordure et couleurs normales et de vol stationnaire.

Section Posts dans l'onglet Style du widget Elementor Timeline avec les commandes Title Color, Typography et Read More Button
La section Posts. Le bouton Lire la suite a son propre remplissage, son rayon et son propre état de vol stationnaire.

Le reste est partagé avec chaque chronologie. Cartes définit le rembourrage, le rayon de bordure et l'arrière-plan, avec des looks distincts par défaut, survolés et focalisés. Ligne définit la piste et la couleur de progression qui se remplit au fur et à mesure que le visiteur défile. points et dates stylez les marqueurs et le texte de la date.

Section Cartes dans l'onglet Style du widget Elementor Timeline avec un aperçu de la chronologie des publications
La carte focalisée, celle vers laquelle le visiteur a fait défiler, peut avoir son propre arrière-plan pour que le message actuel se démarque.

Le tutoriel principal sur la chronologie passe par les sections Ligne, Points et Dates une par une.

Besoin des deux types de chronologie ? Le Widget Chronologie page compare Custom Timeline et Post Timeline côte à côte, avec des démos en direct.

Chronologie de publication par rapport à la chronologie personnalisée

Choisissez Post Timeline lorsque les entrées existent déjà sous forme de publications et Custom Timeline lorsque vous souhaitez écrire vous-même chaque entrée.

FacteurChronologie des publicationsChronologie personnalisée
Le contenu provient dePostes publiésArticles ajoutés dans le panneau
Mises à jourChaque fois que vous publiezLorsque vous modifiez le widget
DispositionsverticaleCarrousel vertical ou horizontal
Chaque entrée montreTitre, image en vedette, date, extrait, Lire la suiteDate ou étiquette personnalisée, contenu, image, lien
se proposerMaître Addons ProAdditions maîtres
Meilleur pourActualités, notes de sortie, journaux intimesHistorique de l'entreprise, feuilles de route, étapes du processus

Si vous voulez la disposition du carrousel, voir comment créer une chronologie horizontale dans Elementor.

Chronologie ou grille de blog : laquelle ?

Utilisez une chronologie lorsque l'ordre compte plus que le choix, et une grille lorsque les lecteurs naviguent.

Si vous construisezCommencer par
Une page d'actualités ou de presseChronologie des publications
Notes de sortie d'une catégoriePoster Chronologie avec un filtre de catégorie
L'index principal du blogWidget de blog en grille ou en mise en page de liste
Articles connexes sous un articleWidget de blog en mode carrousel
Un modèle d'archive de catégorie ou de baliseWidget de blog avec Current Query

Le parcours du quadrillage est parcouru étape par étape comment créer une page de blog avec Elementor. Vous pouvez également utiliser les deux : une chronologie en trois articles des actualités récentes sur la page d'accueil et la grille complète sur la page du blog.

Questions fréquemment posées

Elementor a-t-il un widget de chronologie de publication ?

Non, ni Elementor ni Elementor Pro ne livrent de widget de chronologie Elementor Pro peut lister les publications avec les widgets Posts ou Loop Grid, mais transformer cela en une chronologie avec une ligne et des points prend un CSS personnalisé Un widget de chronologie d'addon le fait à partir des paramètres.

La chronologie de publication dans Master Addons est-elle une fonctionnalité Pro ?

Oui. Le type Post Timeline a besoin de Master Addons Pro. Le type Custom Timeline, dans lequel vous ajoutez chaque élément à la main, n'utilise pas du tout la requête post.

Une chronologie de publication peut-elle afficher des publications d'une seule catégorie ?

Oui. Sélectionnez la catégorie dans le contrôle Catégorie de la section Chronologie Vous pouvez la combiner avec Filtrer par balise et Auteur, et supprimer les messages uniques avec Posts to Exclude.

Puis-je faire une chronologie de publication horizontale ?

Pas dans le widget Addons principaux Les chronologies des messages sont verticales Pour les messages d'une rangée horizontale, utilisez un carrousel de messages ou ajoutez les entrées à la main comme éléments de chronologie personnalisés et passez le style de chronologie à la chronologie horizontale.

La chronologie est-elle mise à jour lorsque je publie un nouveau message ?

Oui. Le widget interroge vos publications à chaque chargement de la page, donc un nouveau message qui correspond aux filtres apparaît sans modifier la page Si un plugin de cache est actif, la page se met à jour une fois son cache effacé.

Réflexions finales

Une chronologie de publication d'élément nécessite trois décisions : qui publie (catégorie, étiquette, auteur, messages à exclure), dans quel ordre (commande et commande par, généralement date) et ce que montre chaque carte (titre, image, extrait, lecture). Le type Post Timeline gère les trois à partir de l'onglet Contenu et reste vertical.

Voir les mises en page et les démos sur le Widget Élémenteur Chronologie page, ou vérifier Prix Master Addons Pro si vous avez seulement besoin de la source de publication.

Photo de Roy Jemee
Roy Jemee
Je suis Roy Jemee, Content Wrangler et Marketer chez Pixar Labs, travaillant sur Master Addons pour Elementor J'écris les tutoriels, enregistre les vidéos, et garde la documentation à jour, donc vous savez toujours comment utiliser chaque fonctionnalité Je gère aussi le support, donc si vous frappez un accroc, je suis la personne qui vous aide à y répondre de vraies réponses, de la part de quelqu'un qui utilise ces outils tous les jours.

Laisser une réponse

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont marqués *