Les conditions d’affichage sont une fonctionnalité d’Elementor PRO introduite début 2024. Cette fonctionnalité permet de contrôler de façon dynamique l’affichage des éléments de votre site. En quelques clics et sans plugin, vous pouvez définir des conditions pour afficher ou non un élément.
Les possibilités sont nombreuses et permettent de réaliser des centaines de scénarios tels que :
- Afficher du contenu à des utilisateurs connectés ou non
- Afficher du contenu à des utilisateurs avec un rôle spécifique
- Afficher du contenu en fonction de l’heure ou du jour de la semaine
- Afficher du contenu en fonction de la saison
- Afficher du contenu en fonction de la catégorie, d’une étiquette
- Afficher du contenu en fonction du parcours visiteurs
- etc…
REMARQUE
Les conditions d’affichage sont une fonctionnalité expérimentale qui doit être activée pour être utilisée. Pour savoir comment activer les fonctionnalités expérimentales : cliquez-ici.
Pour utiliser les conditions d’affichage dynamique, vous devez avoir une licence Elementor PRO ative.
Comment définir une condition d’affichage sur Elementor ?
- Sélectionnez l’élément auquel vous souhaitez appliquer les conditions d’affichage.
Les options de l’élément apparaîtront alors dans le panneau latéral.
- Dans le panneau latéral, cliquez sur l’onglet Avancé.
- Dans la section Mise en page, cliquez sur l’icône Conditions d’affichage.
- Cliquez sur Ajouter une condition.
- Trois menus déroulants apparaissent, vous permettant de créer une condition d’affichage.
- Dans les menus déroulants, sélectionnez les conditions d’affichage souhaitées.
Selon la condition choisie, le contenu des menus déroulants changera.
- Remplissez les menus déroulants supplémentaires de la condition.
REMARQUE
En fin d’article vous retrouverez un résumé des conditions d’affichage disponibles.
- Cliquez sur Enregistrer & Fermer.
REMARQUE
Vos conditions d’affichage ne prendront effet qu’une fois que vous aurez Enregistré ou Publié la page dans l’éditeur. Si vous quittez la page sans enregistrer, les conditions d’affichage que vous avez choisies ne seront pas mises en œuvre.
Pour la plupart des conditions, vous pouvez définir plus d’une valeur.
Par exemple, vous pouvez créer une condition Auteur pour qu’un élément n’apparaisse que lorsque l’Auteur est Gregory ou Louis.
Bonne pratique
En général, il est plus efficace d’utiliser les conditions d’affichage dans un modèle comme dans les exemples mentionnés ci-dessous. Sinon, vous devrez appliquer les conditions individuellement pour chaque instance.
Comment ajouter des conditions d’affichage supplémentaires
Vous pouvez vouloir ajouter plus d’une condition d’affichage. Par exemple, vous pouvez vouloir qu’un article apparaisse s’il est classé à la fois dans une catégorie, et dans une étiquette, ou bien encore dans une catégorie, rédigé par un auteur X. Lors de la configuration des conditions d’affichage, vous avez deux choix : ET ou OU.
Si vous sélectionnez ET, Elementor n’affichera l’élément que si toutes les conditions sont remplies. Si vous choisissez OU, l’élément sera affiché s’il répond à l’une des conditions.
Pour ajouter une condition d’affichage ET :
- Créez une condition d’affichage comme décrit ci-dessus.
- À droite de la condition, cliquez sur le bouton AND.
Un nouveau champ de condition d’affichage apparaît.
- Utilisez les champs pour ajouter une nouvelle condition d’affichage.
- Cliquez sur Enregistrer & Fermer. L’élément ne s’affichera que si les deux conditions sont remplies.
Pour ajouter une condition OU :
- Créez une condition d’affichage comme décrit ci-dessus.
- Sous la condition, cliquez sur Add condition group.
Un nouveau champ de condition apparaît avec un connecteur OR (ou).
- Utilisez les champs pour ajouter une nouvelle condition d’affichage.
- Une fois les conditions ajoutées, cliquez sur Enregistrer & Fermer.
L’élément s’affichera si l’une ou l’autre condition est vraie.
Exemple de condition multiple
Vous pouvez combiner les deux types de conditions (ET et OU). Par exemple, vous pouvez vouloir afficher un élément dans tous les articles de la catégorie référencement wordpress, ou dans tous les articles écrits par Gregory.
Pour ce faire :
- Définissez la catégorie comme Référencement.
- Cliquez sur Add condition group.
- Définissez l’auteur comme Gregory.
Conditions d’affichage disponibles
Pour les pages
Affichez ou masquez les éléments en fonction de l’auteur de la page ou de son emplacement dans la hiérarchie du site.
| Page parente | Si vous créez un site avec une structure hiérarchique de pages parentes et filles, vous avez la possibilité d’afficher des éléments en fonction de leur page parente. Par exemple, toutes les pages filles de la page À propos peuvent afficher le logo de l’entreprise. |
| Auteur | Chaque page d’un site WordPress a un auteur. Vous pouvez afficher des éléments en fonction de l’auteur. Par exemple, lors de la création d’un modèle de page unique, vous pouvez créer une condition pour que seules les pages écrites par Alex ou Jake affichent leurs photos. |
Conditions pour les articles
Affichez ou masquez les éléments en fonction de l’auteur de l’article, de la date d’écriture ou de son classement.
| Dans les catégories | Sur les sites WordPress, les articles sont généralement divisés par catégories. Vous pouvez afficher des éléments en fonction de leur catégorisation. Par exemple, lorsque vous utilisez cette condition dans un modèle d’article unique pour tous vos articles, vous pouvez définir que tous les articles de la catégorie France affichent une image de la Tour Eiffel tandis que tous les articles de la catégorie Angleterre affichent une image de Big Ben. |
| Dans les étiquettes | Sur les sites WordPress, les articles et produits reçoivent souvent des étiquettes pour aider les visiteurs à comprendre le sujet. Donc, par exemple, si vous utilisez un modèle de produit unique pour tous vos produits, vous pouvez afficher des éléments en fonction de leurs étiquettes. Sur un site de vente, par exemple, tous les produits étiquetés comme Spéciaux peuvent avoir un widget de compte à rebours indiquant le temps restant avant qu’ils ne soient plus en solde. |
| Date de modification | Affichez les éléments en fonction de leur dernière modification. Par exemple, tous les articles modifiés la semaine dernière peuvent être marqués Mis à jour. |
| Date de publication | Affichez les éléments d’un article en fonction de sa date de publication. Par exemple, masquez la section commentaires dans les articles publiés avant une certaine date. |
| Auteur | Chaque article WordPress a un auteur. Vous pouvez afficher des éléments selon l’auteur. Par exemple, sur un site de critiques, les articles écrits par le critique de cinéma peuvent afficher le widget vidéo tandis que les critiques du critique gastronomique peuvent afficher des images. |
Conditions selon le statut de l’utilisateur
Affichez ou masquez les éléments en fonction du statut de la personne qui consulte la page.
| Statut de connexion | Affichez les éléments selon que l’utilisateur (quelqu’un qui a un rôle dans la construction et/ou la maintenance du site web) ou le visiteur est connecté ou non. Par exemple, afficher un coupon de réduction uniquement aux visiteurs connectés. |
| Rôle | Affichez les éléments selon le rôle qu’un utilisateur (quelqu’un qui a un rôle dans la construction et/ou la maintenance du site web) a lorsqu’il travaille sur le site |
| Date d’inscription | La date d’inscription marque le jour où un rôle a été attribué à un utilisateur (quelqu’un qui a un rôle dans la construction et/ou la maintenance du site web). Par exemple, si Alex se voit attribuer le rôle d’administrateur le 1er septembre 2024, sa date d’inscription sera le 1er septembre 2024. |
Conditions selon la date et l’heure
Affichez ou masquez les éléments en fonction du moment où la page est consultée.
| Note | Actuellement, la condition d’affichage détermine la date et l’heure par la date et l’heure du serveur où le site est hébergé, et non par la date et l’heure de l’appareil du visiteur. Les versions futures vous permettront d’utiliser la date et l’heure du visiteur pour créer des conditions. |
| Jour de la semaine | Affichez les éléments en fonction du jour de la semaine. Par exemple, vous pourriez afficher une enseigne “Nous sommes fermés” sur votre site le week-end. |
| Heure de la journée | Affichez les éléments en fonction de l’heure de la journée. Par exemple, vous pourriez avoir une image de soleil pendant la journée et de lune la nuit. |
| Date actuelle | Affichez les éléments en fonction de la date. Par exemple, vous pouvez afficher des animations de neige en hiver et de soleil en été. |
Conditions selon les archives
Affichez ou masquez les éléments sur les pages d’archives en fonction du classement des articles.
| Des étiquettes | À utiliser dans les modèles. Permet d’afficher des éléments d’articles dans un modèle en fonction de leurs étiquettes. Par exemple, sur une page d’archive d’un magasin de vêtements, vous pouvez afficher une bannière “Prix réduit” pour tout ce qui est étiqueté “Chapeau” tout en montrant une vidéo de la plage pour tout ce qui est étiqueté “Maillot de bain”. |
| Des catégories | À utiliser dans les modèles. Permet d’afficher des éléments d’articles dans un modèle en fonction de leurs catégories. Par exemple, sur une page d’archive d’un magasin de jouets, vous pouvez afficher une image de dessin animé pour tous les jouets catégorisés “Enfants 3-6 ans”, et un extrait d’un jeu vidéo pour les jouets catégorisés “Enfants 12-16 ans”. |
Conditions selon d’autres statuts
Affichez ou masquez les éléments en fonction de la page d’où provient le visiteur.
| Depuis l’URL | Affichez un élément selon l’endroit d’où provient le visiteur. Par exemple, vous pouvez ajouter un logo personnalisé à une page que seuls les visiteurs d’une page affiliée verront. |
Conditions d’affichage multiples
Vous pouvez choisir plusieurs conditions d’affichage pour un élément. Celles-ci seront toujours reliées par un opérateur logique ET. Par exemple, si vous définissez les conditions d’affichage telles que :
Auteur est Gregory, Date actuelle est le 3 juillet, Jour de la semaine est mardi, toutes ces conditions doivent être remplies pour que l’élément s’affiche. Il ne s’affichera que sur les articles de Gregory lorsque la date sera le 3 juillet et que ce jour tombera un mardi.
REMARQUE
Puisque les conditions d’affichage sont dynamiques, elles ne fonctionnent pas bien avec la mise en cache. Si vous utilisez des conditions d’affichage, nous vous recommandons de désactiver la mise en cache avancée ou tout plugin de mise en cache.
