Qu’ont en commun les sites de biens immobiliers, d’achats en ligne, de petites annonces et presque tout autre site répertoriant un contenu important ?

Leurs visiteurs peuvent y effectuer une recherche ou zoomer sur ce qu’ils recherchent.

Views facilite la création de tels sites en utilisant le filtrage frontal de contenu.

Comment cela fonctionne :

  1. Ajoutez de filtres et sélectionnez des arguments d’URL comme valeurs de saisie.
  2. Activez ces filtres pour qu’ils apparaissent aux visiteurs et définissez leurs valeurs de saisie.
  3. Optez pour un style de mise en page de la section des filtres.

Une fois cela fait, votre View comprendra un filtrage frontal permettant aux visiteurs de choisir comment filtrer les résultats de leur requête.

Regardons comment ceci fonctionne à l’aide d’un exemple : un site d’annonces de biens immobiliers. Voici ce que nous allons réaliser.

Filtrage frontal pour site de biens immobiliers

La partie supérieure de la page est le filtre View, tandis que la partie inférieure affiche les résultats de la requête.

Étape 1 : ajouter de filtres avec les valeurs d’arguments d’URL

Pour permettre aux visiteurs de filtrer les résultats de leur recherche, la View doit tout d’abord comprendre des filtres. Vous pouvez en ajouter par champs personnalisés, taxonomie ou recherche de contenu. Pour tous ceux-ci, les valeurs peuvent être codées en dur dans View ou venir d’arguments d’URL.

Pour le filtrage frontal, choisissez des arguments d’URL. Voici à quoi cela ressemble pour les champs personnalisés (ce sera la même chose pour la taxonomie et la recherche).

Filtrage par champs personnalisés avec les valeurs venant des paramètres d'URL

Lorsque vous choisissez de définir une valeur de filtre par un paramètre d’URL, il vous faut saisir le nom d’un paramètre. Ces noms doivent être propres à la View (c-à-d. que deux champs ne peuvent avoir le même nom). Views utilise ces noms dans l’URL qu’il créé pour filtrer la requête.

Étape 2 : afficher les filtres aux visiteurs

Maintenant que les valeurs de filtre viennent des arguments URL, nous pouvons les générer en utilisant un formulaire HTML. Views peut créer ce formulaire pour vous.

Cliquez sur Modifier en regard des commandes de filtre.

Modifier les commandes de filtre

Vous pouvez choisir l’étiquette, le type et les valeurs de saisie pour chaque filtre. Faites glisser et déposez les différents filtres pour les réorganiser.

Une fois cela terminé et après avoir cliqué sur OK, les paramètres des filtres sont ajoutés au HTML méta pour la section Requête de View. Vous pouvez aller sur la View pour voir à quoi cela ressemble.

Étape 3 : mettre en forme l’HTML du filtre

Par défaut, Views a appliqué un format de base à la section de filtre. Chaque filtre est encadré par des balises <p>…</p>. Vous préférerez certainement les changer pour la plupart des sites. Regardez comment, dans notre exemple, nous encadrons les différents éléments du filtre dans des balises DIV. Peut-être préférerez-vous utiliser un tableau ou une autre balise.

Cliquez sur le bouton Afficher/Modifier HTML méta, en bas de la section Requête de View. Vous verrez la balise générée par Views. N’hésitez pas à la modifier à votre guise. La « magie » vient des codes courts wpv-control. Ils sont ceux qui génèrent les champs de saisie actuels pour le formulaire de filtre.

N’afficher que le filtre

Plusieurs sites requièrent des formulaires de recherche paramétrique sur leurs pages d’accueil, sans pour autant que les résultats y soient répertoriés. Une fois que les visiteurs cliquent sur Recherche, ils sont dirigés vers la page « résultats de la recherche ».

Pour implémenter ceci, vous pouvez maintenant n’insérer que le filtre en tant que View dans votre contenu.

Assurez-vous tout d’abord d’insérer la View offrant une possibilité de recherche dans du contenu. Il peut s’agir d’une page, d’une publication ou d’un type personnalisé, quel qu’il soit.

Ensuite, modifiez la page d’accueil du site ou toute autre page où vous ne désirez insérer que le formulaire de recherche. Cliquez sur l’icône V pour insérer une View.

Formulaire View prêt à être inséré

Vous remarquerez une nouvelle section Formulaire View. Chaque View dont le filtrage frontal est activé s’affichera ici.

Sélectionnez cette View et un pop-up s’ouvrira. Ce pop-up vous demandera dans quelle page vous aimeriez rechercher des résultats directement. Vous pourrez choisir parmi les pages dans lesquelles vous avez inséré cette View. Normalement, une seule page devrait s’afficher.

Voilà, terminé ! Rendez-vous sur votre page d’accueil et découvrez le filtre View en action.

Page d'accueil avec formulaire View.