Adding 'Add to cart' button to Featured Collection on the homepage (Minimal theme)

SlowDisco
Tourist
4 0 2

Hey, I am using the Minimal theme and have used the 'featured collection' block to display my products (as I only have 3, so this is fine for me).

But I want to be able to add 2 things;
1 - A snippet from my product page (a brief description/ the main scents of my candles)
2 - An 'Add to Cart' CTA 

My website for reference: www.slowdisco.co

Thanks in advance!

Replies 11 (11)

KetanKumar
Shopify Partner
36831 3635 11964

@SlowDisco 

Thanks for post can you please try this 

ust follow the steps for theme for Add to cart button on collection pages.

  • From Shopify Admin select Online Store and click on Themes
  • Choose your main theme
  • Click the . . . on the top left-right (see below) and hit Edit code
  • Open Snippets -> product-card-grid.liquid or product-card or product-gird-item File and paste below code at the end of the page.
    <form method="post" action="/cart/add">
      <input type="hidden" name="id" value="{{ product.variants.first.id }}" />
      <input min="1" type="number" id="quantity" name="quantity" value="1"/>
      <input type="submit" value="Add to cart" class="btn" />
    </form>
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
SlowDisco
Tourist
4 0 2

Hi Ketan,

This worked perfectly for the ATC button, thank you! Would there be something similar for adding a snippet of the description to each product? 

 

KetanKumar
Shopify Partner
36831 3635 11964

@SlowDisco 

Yes, please 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
SlowDisco
Tourist
4 0 2

Is this a piece of code you could provide?

So it would be like:

Product Title
Product Price
[Sentence from product description]
Add to cart

KetanKumar
Shopify Partner
36831 3635 11964

@SlowDisco 

thanks can you please this file code so i will update and set code 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
SlowDisco
Tourist
4 0 2

I'm not sure I understand what you mean. I should accept as solution? 

KetanKumar
Shopify Partner
36831 3635 11964

@SlowDisco 

Yes, also please share your code if you need proper sequence 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
AlayaTea
Tourist
3 0 2

Hi Ketan! Could you tell us if there is a way to make the "Add to Cart" button centered alignment? (right now the alignment is to the left) Thankyou!

KetanKumar
Shopify Partner
36831 3635 11964

@AlayaTea 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
lesmursdemarie
Visitor
1 0 0

Hello, I copied your codes and it works for me too. If I want my "add to cart" box to be as large as my product description, can you help me? Here is my website. Right now, it is on the left side of product picture and not centered. 

Also, my ATC box is colored. Can it simply outlines and not colored?

https://lesmursdemarie.com/collections/collection-couleurs-douces

 

Thank you

Jahid-KlinKode
Excursionist
145 1 4

Hi @SlowDisco, resolve the issue of missing "Add to Cart" buttons on your Shopify collection pages by checking out this YouTube tutorial: https://www.youtube.com/watch?v=s98l1bUZe6k