Comment créer une saisie semi-automatique de recherche Shopify

Rate this article

Share this article

Étapes pour créer un champ de recherche de saisie semi-automatique Shopify pour le commerce électronique

Méthode 1 – Utilisation de l’application de recherche Shopify d’Expertrec.

  1. Installez l’extension de recherche Shopify d’Expertrec à partir d’ici.
    shopify search app
  2. Une fois l’extension installée, vous serez dirigé vers votre panneau de configuration où vous devrez activer votre moteur de recherche en activant l’extension de recherche activée.

Méthode 2 – Utilisation du plugin de barre de recherche Shopify d’Expertrec

  1. Connectez-vous à votre boutique Shopify.
  2. Accédez à https://www.expertrec.com/shopify/
    Ecommerce Shopify Autocomplete search box
  3. Saisissez l’URL de votre boutique Shopify.
  4. Cliquez sur installer.
  5. Cliquez sur installer l’application non répertoriée.
    Ecommerce Shopify Autocomplete search box
  6. Vérifiez maintenant la recherche de votre boutique Shopify.
  7. La barre de saisie semi-automatique Shopify ressemblera à l’image ci-dessous.
    Ecommerce Shopify Autocomplete search box
  8. La page de résultats de recherche Shopify ressemblera à ceci.
    Ecommerce Shopify Autocomplete search box
  9. Cette méthode ajoute également la recherche vocale à votre boutique Shopify.

Méthode 3- En modifiant le code

La fonction de recherche de boutique en ligne de Shopify est un outil puissant et complet que les acheteurs peuvent utiliser pour effectuer les recherches nécessaires sur des produits, des pages et des articles spécifiques d’une boutique. Plus important encore, si vos clients souhaitent optimiser leur recherche ou si vous êtes propriétaire d’une entreprise avec une boutique Shopify et que vous souhaitez améliorer l’option de recherche afin que vos acheteurs puissent voir les types de résultats souhaités et spécifiques, alors cet article c’est tout ce dont vous avez besoin. Fondamentalement et explicitement, il met en évidence les processus ou les moyens de créer une saisie semi-automatique de recherche Shopify.

Ecommerce Shopify Autocomplete search box

Pour les particuliers et les entreprises qui cherchent à faire passer leurs efforts commerciaux au niveau supérieur, ils trouvent idéalement des moyens de configurer la saisie semi-automatique sur leurs barres de recherche, ce qui fait sans aucun doute de la magie. En attendant, même si certains connaissent bien la bonne approche à suivre, il est regrettable qu’une grande variété d’options supposées disponibles n’apporte pas grand-chose au profane. Il manque peut-être certaines choses. Heureusement, une saisie semi-automatique pour le champ de recherche sur Shopify doit fonctionner tant qu’elle est personnalisée pour Shopify Doc.

shopify search autocomplete

De plus, cela est tout aussi crucial pour les personnes dont les clients disposent d’un large inventaire de produits ou d’une grande variété de contenu non produit. Essentiellement, votre client pourrait avoir besoin d’une méthode de recherche plus nuancée, à mesure que ses magasins deviennent de plus en plus complexes. Cela les aidera à filtrer certains résultats ou à donner la priorité aux produits par rapport aux pages habituelles qu’ils visitaient. Parmi les rares à exploiter cette fonctionnalité intéressante se trouve Expertrec. Le moteur de recherche personnalisé d’Expertrec est une plate-forme fiable qui permet de créer une saisie semi-automatique de recherche Shopify.

Ils offrent une approche simple où un individu ou une entreprise peut divulguer toutes les opportunités inhérentes. Certaines des fonctionnalités d’Expertrec sont : ultra rapide, pas de publicité, PDF, recherche d’images, configuration rapide, etc. Avec un prix de départ de 9 $/mois et d’autres modules complémentaires, Expertrec est un outil de recherche de qualité impressionnant dont vous avez besoin pour votre site Web.

Pour créer une saisie semi-automatique de recherche Shopify, il existe une approche DIY, qui est fortement recommandée. En d’autres termes, la saisie semi-automatique des champs de recherche dans votre boutique Shopify est quelque chose que vous pouvez faire vous-même. C’est facile à faire et c’est sans aucun doute une fonctionnalité intéressante.

Depuis votre boutique Shopify, il vous suffit de vous rendre dans votre administrateur, puis sur

Boutique en ligne > Thèmes > Actions > Modifier le code.

Par exemple, il existe un concept d’implémentation d’une recherche à saisie semi-automatique avec jQuery et la bibliothèque jQuery UI. Cela exploite la recherche Shopify, Liquid et JavaScript/jQuery, et est adopté par Expertrec. Quelle que soit l’approche que vous adoptez, une compréhension modérée de jQuery et de Liquid est essentielle.

Le plugin de saisie semi-automatique jQuery UI a besoin d’une source de données, et il est plutôt impossible de charger autant de données dans chaque page, même s’il est possible de vider tous les produits dans un énorme objet JSON dans la source de la page. La vitrine Shopify entre ici, car Shopify utilise Apache pour renforcer sa recherche. Autrement dit, vos produits, articles de blog et articles indexés y sont déjà contenus.

LE LIQUIDE

Shopify dispose d’une autre fonctionnalité intéressante qui vous permet d’afficher l’URL et de la transférer ensuite vers un modèle liquide spécial qui correspond à cette vue. C’est ce qu’on appelle « le liquide ». Ici, vous devrez peut-être créer un modèle contenant un fichier nommé search.json.liquid.

Shopify search autocomplete

Maintenant, il est vrai que lorsque vos visiteurs tapent dans le champ de recherche de votre vitrine, ils ont des attentes. Et si vous ignorez ces éléments, ils pourraient avoir des conséquences néfastes sur votre entreprise. La possibilité d’inciter vos visiteurs à accéder à n’importe quelle page de produit en un seul clic devient donc extrêmement cruciale. Encore une fois, pour certains, créer un modèle de recherche alternatif peut suffire.

Pas:

  1. Pour créer un nouveau modèle pour la page de recherche – search.json.liquid Ici, dans le répertoire des modèles, cliquez sur le lien “Ajouter un nouveau modèle” et choisissez le type d’option que vous désirez pour votre nouveau modèle. Dans le cas d’un modèle de recherche alternatif, cliquez sur Rechercher et nommez-le JSON.
  2. Cliquez sur “Créer un modèle”, qui apparaîtra sur l’éditeur de code, tandis que le fichier sera rempli avec le code par défaut.shopify search autocomplete
  3. Créez un fichier search-autocomplete.liquid. Celui-ci se trouve dans le répertoire Snippets. Dans la fenêtre contextuelle, vous verrez quelque chose comme : “Donnez à votre extrait le nom search -autocomplete”. Cliquez sur Créer un extrait.shopify search autocomplete
  4. Maintenant, modifiez le fichier theme.liquid. Localisez le fichier theme.liquid dans le dossier Layouts. Cliquez dessus pour l’ouvrir dans l’éditeur de code en ligne. Faites défiler vers le bas et vous verrez la balise de fermeture.

De même, ce concept peut être introduit dans votre recherche de produits de commerce électronique pour une expérience utilisateur incroyable, et Shopify Search Autocomplete est un excellent moyen de réaliser et d’améliorer cet exploit. Comment cela fonctionne : implémentez la saisie semi-automatique, et immédiatement après cela, l’utilisateur peut sélectionner un produit recommandé dans le champ de recherche et être dirigé vers la page de destination du produit.

De plus, il existe quelques conseils simples que vous pouvez adopter pour améliorer votre recherche de produits sur Shopify.

  1. Rendre votre champ de recherche facile à identifier – Pour tous ceux qui ont déjà travaillé sur tout type de projet de développement d’application Shopify personnalisé, ils connaissent l’importance de la recherche de produits. L’une des meilleures façons de procéder est de rendre le champ de recherche facile à repérer pour quiconque a l’intention de l’utiliser, et cela consiste à améliorer l’UX. Puisqu’il est courant et raisonnable de rechercher le champ de recherche au début, il est donc important que vous, en tant que propriétaire de vitrine en ligne, accordiez beaucoup d’importance à votre champ de recherche chaque fois que vous implémentez les paramètres de recherche de Shopify.
  2. Adoptez l’utilisation de l’éditeur de champs méta. Il s’agit de l’une des méthodes les plus courantes et les plus efficaces pour améliorer la recherche visuelle Shopify pour votre boutique. Il est gratuit et vous permet d’ajouter des champs méta liés à un produit particulier, pour améliorer la recherche.
  3. La recherche rapide doit être mise en œuvre. Le temps, disent-ils, c’est de l’argent. Cela s’applique également au cas de recherche de produits où les détails des produits doivent être récupérés en une fraction de seconde. Imaginez que votre champ de recherche prenne beaucoup de temps pour récupérer les détails, cela peut être très frustrant et par conséquent entraîner une expérience utilisateur épouvantable. Par conséquent, assurez-vous que votre outil de recherche est à haute vitesse, et dans ce cas, une excellente solution d’hébergement basée sur le cloud ne sera pas une mauvaise idée.
  4. Et la saisie semi-automatique ? Les utilisateurs sont récemment devenus de grands fans du concept d’autosuggestion et d’autocomplétion depuis son introduction par Google. Comme son nom l’indique, immédiatement après avoir commencé à taper quelque chose dans le champ de recherche Google, vous obtenez des requêtes de recherche associées grâce à cette fonctionnalité. Cela signifie que vous n’avez pas besoin de saisir entièrement toutes les questions pour obtenir le résultat souhaité.

Obtenez l’application ExpertRec Shopify

Enfin, la recherche personnalisée Expertrec est une excellente plate-forme pour créer la saisie semi-automatique de la recherche Shopify. Facile à configurer, rapide, efficace, abordable et vous offre le trafic de recherche tant souhaité. Vous pouvez créer votre saisie semi-automatique de recherche Shopify à l’aide d’Expertrec à partir d’ici.

Les références

https://community.shopify.com/c/Shopify-Design/Auto-complete-for-search-boxes/m-p/419285

https://www.shopify.com.ng/partners/blog/custom-search

https://community.shopify.com/c/Shopify-Design/DIY-Implementing-Autocomplete-with-Search/m-p/59750

http://unofficialshopify.blogspot.com/2016/09/how-to-enable-autocomplete-for-search.html

Are you showing the right products, to the right shoppers, at the right time? Contact us to know more.
You may also like