Apparence et intégration dans le thème

Overlay ou dans le thème, les sélecteurs qui relient la recherche à la boutique, l'aspect des résultats et les textes que le visiteur lit.

Tout ce qui se trouve ici vit dans Recherche → Boutiques → Modifier, et arrive au panneau de recherche automatiquement : on ne touche pas au module et on ne fait aucun déploiement dans la boutique.

Où apparaissent les résultats

Le panneau de recherche a deux modes, et le choix dépend du thème :

• Par-dessus la boutique (overlay) : les résultats s'ouvrent dans une couche à part qui recouvre la page. Cela fonctionne sur n'importe quel thème sans configuration. Ici, vous pouvez définir le logo (en pointant celui du thème avec un sélecteur, ou en téléversant le vôtre) et le lien du panier, pour que la couche garde la navigation essentielle de la boutique.
• Dans le thème (inline) : les résultats se dessinent à l'intérieur d'un conteneur du thème lui-même, comme une page de la boutique. Cela demande deux sélecteurs : celui du conteneur et, en général, celui de ce qu'il faut masquer pendant la recherche. Sur une page où le conteneur n'existe pas, le panneau de recherche passe automatiquement en overlay.

Les sélecteurs

Ce sont la colle entre le panneau de recherche et le thème, et c'est là qu'une intégration se passe bien ou mal :

• Barre de recherche : par défaut input[name='s']. Si votre thème en utilise un autre, c'est le premier à ajuster, et cela s'ajuste dans la configuration du module.
• Boutons qui ouvrent la recherche : icônes ou boutons du thème (la loupe du menu sur téléphone, par exemple). Dès qu'ils sont touchés, le panneau de recherche s'ouvre avec sa propre zone de saisie.
• Boutons qui ouvrent l'assistant : la même chose, pour l'assistant.
• Masquer pendant la recherche : ce qui, dans le thème, doit s'écarter tant que les résultats sont à l'écran, en mode inline.

Si la recherche de la boutique répond toujours Le sélecteur de la barre n'attrape pas le bon input. Inspectez le champ dans le thème et corrigez-le ; c'est la cause de neuf intégrations à moitié faites sur dix.

Pagination

Pour atteindre le reste des résultats, il y a trois options : un bouton « Voir plus », le défilement infini ou les pages numérotées. Chacune a son coût et son bénéfice expliqués sur l'écran lui-même.

Apparence des résultats

Couleur d'accent, rayon des coins, produits par ligne (sur ordinateur et sur téléphone), et ce que chaque carte montre : bouton d'achat (activé par défaut), texte de l'appel à l'action, marque, référence, badge de remise et avis de rupture.

La police ne se configure pas : le panneau de recherche hérite toujours de celle de la boutique, pour s'intégrer au thème. C'est l'une des rares choses fermées exprès, et la raison en est qu'une recherche avec sa propre typographie ressemble toujours à une boîte appartenant à quelqu'un d'autre, collée par-dessus la boutique.

Un produit qui se trouve déjà dans le panier du visiteur apparaît marqué : la carte gagne un cadre dans la couleur d'accent, le bouton d'achat montre les unités qui s'y trouvent, et dans les listings de la boutique elle-même la carte du thème reçoit un badge « Dans le panier ». Le marquage suit le panier en temps réel, que l'ajout ait été fait dans la recherche ou dans la boutique.

Pour ce que les options ne couvrent pas, il y a la zone de CSS supplémentaire (jusqu'à 4000 caractères), injectée à la fin de la feuille de styles du panneau de recherche.

Textes du panneau de recherche

Tous les textes que le visiteur lit (« Voir plus de résultats », « Sans résultat pour… », le tri, les filtres) ont une traduction maison dans chaque langue de l'index. Dans la section Textes, vous pouvez remplacer n'importe lequel d'entre eux, langue par langue.

Un champ laissé vide garde notre version et continue de recevoir les corrections futures ; seul ce que vous écrivez reste figé à votre façon. Il vaut la peine de ne toucher qu'à ce que votre boutique dit autrement, et de laisser le reste suivre les versions du panneau de recherche.