FacetWP – Submit button

Ajouter un Bouton de Soumission avec FacetWP

Lorsqu’il s’agit d’améliorer l’expérience utilisateur sur les sites WordPress, l’ajout d’un bouton de soumission via le plugin FacetWP permet de rediriger les utilisateurs vers une page de résultats après avoir sélectionné des filtres. Cela est particulièrement utile lorsque vous souhaitez afficher des filtres sur une page, comme la page d’accueil, tout en dirigeant les utilisateurs vers une page distincte pour les résultats. Le plugin FacetWP offre cette possibilité de manière simple et efficace à l’aide de l’add-on “Submit Button”.

Installation et Configuration du Plugin

Étape 1 : Installation de l’Add-on Submit Button

La première étape consiste à télécharger, installer et activer l’add-on “Submit Button”. Assurez-vous que votre installation WordPress est à jour avant cela.

Étape 2 : Créer un Modèle de Listing

Pour que les facettes apparaissent sur la page principale, un modèle de listing doit être créé. Cela permet à FacetWP de savoir quelles options de facettes afficher. Dans la plupart des cas, ce modèle de listing ne doit pas être visible sur les pages principales, vous le masquerez donc avec du CSS à l’étape 5.

L’utilisation de l’outil de création de listings de FacetWP facilitera cette tâche. Rendez-vous dans Paramètres > FacetWP > Listings et ajoutez un nouveau modèle de listing. Cliquez sur l’onglet “Query” pour indiquer à FacetWP de quel type de contenu il doit tirer des informations. Essayez de faire correspondre cette requête à celle de la page de résultats où vous redirigerez vos utilisateurs.

Étape 3 : Créer les Facettes

Créez ensuite les facettes que vous souhaitez placer sur la page de filtrage primaire. Ces facettes sont essentielles car elles déterminent les critères de filtrage que les utilisateurs pourront choisir sur la page d’accueil.

Étape 4 : Configurer la Page de Résultats

Cette étape consiste à configurer la page qui affichera les résultats. Cela peut être une page de résultats déjà existante ou une nouvelle page que vous allez créer. Utilisez le Listing Builder pour mettre en place votre shortcode sur une page WordPress classique, en y intégrant également les shortcodes des facettes que vous avez créées précédemment. Assurez-vous que les requêtes des résultats et de la page principale correspondent le plus possible pour une expérience utilisateur cohérente.

Étape 5 : Mettre en Place la Page de Filtrage Primaire

Admettont que vous avez créé un modèle de listing nommé “listing” et deux facettes appelées “location” et “categories”. Pour intégrer tout cela sur votre page principale, vous devrez modifier le fichier de modèle approprié (par exemple, homepage.php) en y ajoutant le code nécessaire pour afficher les facettes et le bouton de soumission.

Pour ceux qui préfèrent utiliser les shortcodes, sachez qu’ils peuvent être intégrés directement dans les écrans d’édition de posts ou de pages. Cela inclut des modules de shortcode disponibles dans la plupart des constructeurs de pages.

Utilisation Avancée du Bouton de Soumission

Faciliter l’interaction des utilisateurs avec le bouton de soumission est une priorité. FacetWP permet plusieurs personnalisations pour que le bouton fonctionne de manière optimale.

Soumission Automatique sur Touche Entrée

Si vous souhaitez que le bouton de soumission soit activé non seulement lorsqu’il est cliqué, mais aussi quand l’utilisateur presse la touche “Entrée”, vous pouvez ajouter un code spécifique dans le fichier functions.php de votre thème enfant. Cela empêche les redirections lorsque des facettes ne sont pas sélectionnées, ce qui garantit que les utilisateurs ne seront pas dirigés vers une page de résultats vide.

Soumission sur Sélection de Facettes

Pour les cas où vous n’avez qu’une seule facette sur la page de filtrage primaire, vous pouvez faire en sorte que la page redirige immédiatement dès qu’une sélection est faite, rendant ainsi l’usage de la soumission du bouton superflu.

Personnalisation Visuelle du Bouton

Si vous souhaitez rendre le bouton de soumission plus esthétique ou moins intrusif pendant l’interaction avec les facettes, différents styles CSS peuvent être appliqués pour modifier son apparence, comme changer la couleur ou atténuer sa visibilité pendant le processus de sélection.

Scrolling Automatique sur la Page de Résultats

Pour optimiser l’expérience utilisateur après avoir cliqué sur le bouton de soumission, un code peut être ajouté pour faire défiler automatiquement la page vers le début de la liste de résultats. Cela aide les utilisateurs à visualiser facilement ce qui a été filtré, surtout si la mise en page est chargée d’éléments.

Autres Considérations

Pour ceux qui utilisent des thèmes comme Listify ou Listable, sachez qu’ils possèdent une mise en œuvre spécifique des facettes avec un bouton de soumission. Il est donc crucial de vérifier la compatibilité et de s’assurer que toutes les fonctionnalités fonctionnent sans accroc.

Ainsi, grâce à l’add-on “Submit Button” de FacetWP, vous pouvez améliorer non seulement la navigation sur votre site, mais également la satisfaction de vos utilisateurs. En redirigeant les utilisateurs vers une page de résultats après qu’ils aient fait leurs sélections de filtres, vous leur offrez une expérience intuitive et fluide, très appréciée dans le design web actuel. L’intégration de cette fonctionnalité enrichira indéniablement votre site WordPress et rendra l’interaction des visiteurs plus engageante.