La plate-forme Shopify est un excellent endroit pour démarrer votre activité de commerce électronique. Il dispose de tout ce dont vous avez besoin pour démarrer, y compris un CMS intégré, des services de traitement des paiements et d'envoi d'e-mails.

Si vous souhaitez ajouter une icône de panier personnalisée sur la boutique Shopify à l'aide de code, cet article vous aidera. Dans cet article, nous expliquerons comment ajouter une icône de panier personnalisée sur la boutique Shopify en utilisant un code avec un processus étape par étape afin qu'il vous soit facile de comprendre le concept.

Avantages de l'ajout d'une icône de panier personnalisé

Vous souhaitez créer une identité de marque unique en ligne, donnez à votre magasin un aspect unique. Personnalisez l'expérience d'achat de vos acheteurs avec des icônes, des graphiques, des couleurs et une UX/UI personnalisés.

Ajoutez une icône de panier personnalisée sur la boutique Shopify pour booster votre image de marque. Une icône de panier personnalisée améliore l'apparence de votre magasin et a un impact sur la psychologie des utilisateurs pour effectuer un achat réussi.

Nous vous apprenons à ajouter une icône personnalisée à "ajouter au panier" en utilisant quelques lignes de code simples dans cet article.

Passons au didacticiel -

Comment ajouter une icône de panier personnalisé sur Shopify Store en utilisant le code

#Étape 1 - Connectez-vous à votre panneau d'administration Shopify

La première étape consiste à vous connecter à votre panneau d'administration Shopify en saisissant les identifiants de connexion requis.

#Étape 2 - Choisissez votre thème en direct

Après être entré dans le panneau d'administration, cliquez sur la boutique en ligne comme on le voit dans le menu de gauche puis Thèmes.

#Étape 3 - Créer une sauvegarde

Créez maintenant une sauvegarde en choisissant votre thème actuel. Cliquez sur Actions un menu déroulant s'ouvrira puis cliquez sur Dupliquer.

#Étape 4 - Ouvrir le fichier icon-cart.liquid

Vous avez maintenant créé une sauvegarde des fichiers de code actuels. Il est temps de changer le code pour ajouter une nouvelle icône de panier. Cliquez à nouveau sur les Actions et Modifier le code options. Lorsque vous cliquez sur le code d'édition, un éditeur de code doit apparaître sur votre écran et un menu de liste de fichiers de code .liquid apparaît à gauche de l'éditeur de code. Trouvez maintenant le fichier icon-cart.liquid en faisant défiler vers le bas et en effectuant une recherche.

Cliquez et ouvrez le répertoire icon-cart.liquid (fichier), le fichier de code doit apparaître à droite de votre éditeur.

# Étape 5 - Supprimer et ajouter du code

Supprimez tout le code du fichier ouvert et ajoutez le nouveau code au fichier pour ajouter l'icône.

La meilleure façon d'ajouter une icône de panier est de copier le code d'icône de panier intégré à partir de sites Web tiers tels que

Sélectionnez l'icône du panier que vous souhaitez ajouter, copiez le code HTML intégré, revenez à l'éditeur de thème et collez le code.

ÉCONOMISEZ MAINTENANT!

C'est fait!

#Étape 6 - Redimensionner l'icône

Si l'icône du panier ne semble pas appropriée, vous pouvez la redimensionner. Pour redimensionner, recherchez et ouvrez le répertoire Assets et sélectionnez la feuille de style. En général, le nom du fichier est theme.scss.liquid mais il peut être intitulé différemment.

Copiez maintenant le code suivant et collez-le en dernier dans le fichier CSS.

.site-header__cart img { width: 25px; height: 25px; }

Si la taille vous semble toujours imparfaite, vous pouvez modifier la largeur et la height de l'icône et tester.

Derniers mots

C'est tout sur notre site, si vous rencontrez toujours des difficultés pour ajouter l'icône du panier, contactez-nous, notre développeur Shopify vous aidera.