Liquid, JavaScript, themes, sales channels
Hi!
I added "add to cart" button with products on home page. I added the following code in card-product.liquid
<form method="post" action="/cart/add"> <input type="hidden" name="id" value="{{ card_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>
Now content of cart is overlapping as follows.
Any help will be appreciated.
Solved! Go to the solution
This is an accepted solution.
Your theme has quick add by default, please enable it from Online store > Themes > Customize > Collections > Default collections > Product grid > precheck b
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
Hey @Bella_Lenses
Could you please provide your Store URL and, if applicable, the Password too? Your cooperation is greatly appreciated!
Best Regards,
Moeed
Hey @Bella_Lenses
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag
<style>
.card__information {
padding-bottom: 0 !important;
}
form {
margin-top: -15px !important;
}
</style>
RESULT:
If I managed to help you then, don't forget to Like it and Mark it as Solution!
Best Regards,
Moeed
Really apologize, I am not allowed to share the store login information at this time.
This is an accepted solution.
Your theme has quick add by default, please enable it from Online store > Themes > Customize > Collections > Default collections > Product grid > precheck b
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
Yes tried it as you said but not showing "Add to Cart" button.
If you want to make it appear like the custom code you added, please add the code, give me password protected of your store so I can provide the code to solve the overlap issue
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
Thank you for your prompt reply. Yes already shared above.
I saw you already solve the issue.
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
I apologize, I am not allowed to share the store login information at this time.
This is Noah from PageFly - Shopify Page Builder App
Please add this code to your theme.liquid above the </head> to get this solved
Step 1: Online Stores > Themes > More Actions > Edit code
Step 2: click on theme.liquid and paste the code above the </head>
<style>
.product-grid li {
padding-bottom: 20px;
}
.product-grid li form {
margin-top: -15px;
}
</style>
Hope this can help you solve the issue
Best regards,
Noah | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
PageFly - #1 Page Builder for Shopify merchants.
All features are available from Free plan. Live Chat Support is available 24/7.
The problem is solved now. There is an option to add the button on home page, featured products.
User | RANK |
---|---|
37 | |
29 | |
12 | |
12 | |
8 |
On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023The year-end shopping season is just around the corner. Is a flash sale on your radar? Are...
By Jasonh Nov 6, 2023