Brooklyn Theme: Home page product "buy now" accesability

Solved
Highlighted
Tourist
19 0 1

Hello,

I am using Brooklyn Theme and I would like all products to be visible on the home page instead of "collections", since we have few products and users to have the ability to buy now or add to cart instead of click on the product to be directed to another page. Is this possible?

Thanks!

0 Likes
Highlighted
Shopify Partner
633 74 104

@newuser14 ,

Yes this is possible you need to put all your product in one collection which you can show as default on the Home page.You would then need to customize the collection grid to show add to cart/ buy now buttons. For example, you can check out this https://bhavnagaris.com

- Was my reply helpful? Click Like to let me know!
- Was your question answered? Click Accept as Solution

Skype : lokendra.panwar1

To hire: email us at shopify@propero.in
0 Likes
Highlighted
Tourist
19 0 1

@Propero 

Thank you! how do I customize the collection grid to show add to cart/buy now buttons?

 

0 Likes
Highlighted
Shopify Partner
633 74 104
  • 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 File and paste the

 

<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>​

below code at the end of the page. ( if you do not have the same file then will need to look for equivalent file in your theme)

 

  •  
  •  
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Click Accept as Solution

Skype : lokendra.panwar1

To hire: email us at shopify@propero.in
0 Likes
Highlighted
Tourist
19 0 1

@Propero 

This is what the Snippets section looks like for me (see picture below)

edit code.png

 

 

section looks like for me (see picture below)

 

0 Likes
Shopify Partner
633 74 104

use product-grid-item.liquid in this case, mostly it should be good, else DM me and I will help you fix it from backend

- Was my reply helpful? Click Like to let me know!
- Was your question answered? Click Accept as Solution

Skype : lokendra.panwar1

To hire: email us at shopify@propero.in
0 Likes
Highlighted
Tourist
19 0 1

@Propero 

Got it but now it looks like this: (also I'd DM you but I'm not sure how)

Untitled.png

0 Likes
Highlighted
Shopify Partner
633 74 104

This is an accepted solution.

@newuser14 , you got everything working functionally, need to work on the style to fine-tune further.

You may email me if you still need support  lokendra@propero.in 

- Was my reply helpful? Click Like to let me know!
- Was your question answered? Click Accept as Solution

Skype : lokendra.panwar1

To hire: email us at shopify@propero.in
0 Likes
Highlighted
Tourist
19 0 1

@Propero Thank you so much for your help!

1 Like
Highlighted
Tourist
26 0 3

hey

i had the same problem. how do you fix it?

thanks you

 

@Propero @newuser14 

0 Likes