Shopify themes, liquid, logos, and UX
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
Hi,
We have a quick add to cart option on our collection pages. It is custom coded. Can anyone help me adjust how it looks? I need it to be under the image as the options covers the images when they are active - specially on mobile.
We just want the option underneath or still have the image fully shown.
This is the preview : https://e1gja361fggr6cev-37813911684.shopifypreview.com
Hello @VA-Laurice
Go to online store ----> themes ----> actions ----> edit code ---->assets ---->custom.css ---> line number 46
search this code
.webcast-variant-box span.quick-product__label {
margin-top: 10px;
display: inline-block;
background-color: var(--colorBtnPrimary);
width: 100%;
padding: 10px;
}
and replace with this code ( you can change the color as per your requirement)
.webcast-variant-box span.quick-product__label {
margin-top: 10px;
display: inline-block;
background-color: transparent;
width: 100%;
padding: 10px;
border: 2px solid #00ffaa;
color: #00ffaa;
font-size: 21px;
font-weight: bolder;
}
result
If this was helpful, hit the like button and accept the solution.
Thanks
Is there a way that we can put it outside the photo? It can be in between the title and the photo.
Hi @VA-Laurice I think you want it outside the image box, if yes then you need to move the code that is written inside the box to outside the box so that it will work accordingly, maybe while doing it you can face some issue, so keep that in mind do it with precaution so that it will not effect the functionality, that is working right now.
If you will unable to implement the same then I'm happy to do this for you, let me know. I can implement the code changes so that this will work well for you.
Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!
Best Regards
Sahil
- Your