You need to modify your Shopify theme to personalize it and you want to have an "Add to cart" button on your collection pages?
Unfortunately, not all themes offer this option directly. We will therefore have to put our hands in the code to obtain this new functionality.
Here is the walkthrough with the code that is fine.
Why have an "add to cart" button on the collection pages?
You can easily create an "Add to Cart" button in Shopify that showcases a single product that includes one or all of the product variants on your collection pages. This will allow your customers to easily and effortlessly add products to cart without having to open the product page.
It is a good practice of ergonomics that it is obviously important to AB test to see if it can increase your conversion rate.
Generally, the easier you make it to access your products, the higher your average shopping cart and higher conversion rate.
Here are the steps to follow to create an "add to cart" button
- Log in to your Shopify back office (admin)
- Find the theme you want to modify and click on "Action / Modify the code"
- In the list of templates, look for the "collection" template
- Look for (ctrl + F ) the code {% for product in collection.products %} Add the following code just below:
- Click Save
- Click Preview to see the result on your site
Bonjour, est-il possible de séparer les options s’il y en a plus d’une avec 2 selects distincts avec un pour la taille et un autre pour la couleur par exemple ? Dans ce cas, je peux choisir la taille et la couleur indépendamment que de me faire dérouler toute la liste de mes variantes qui peut être génant a l’utilisation sur de gros produit. Merci de votre réponse. Cordialement
Bonjour Steve, tu dois avoir un template “Collection” qui fait appel à une section “main collection” ou “collection” qui elle fait appel à un snipet de produit. C’est à cet endroit qu’il faut l’ajouter.
On peut s’en charger car modifier le code d’un site “live” ca reste une opération risquée.
Bonjour j’ai le thème sense et je voudrais savoir ou dans le code je dois placer ce code pour les bouton ajut au panier dans collection.
merci