Shopify themes, liquid, logos, and UX
Hello,
I am using the Motion Theme and would like to Hide the Sold Out price on the product and collection pages. Also, gray out the product picture when sold out. Please help!!!
Thank you
hello,
Welcome to the Shopify community!
and Thanks for your Good question.
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the fil
.grid-product__tag.grid-product__tag--sold-out {
display: none;
}
I will try. Also, how do you opacity a sold out product picture I’m collections and in the product page?
@Qualitycheck wrote:hello,
Welcome to the Shopify community!
and Thanks for your Good question.1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the fil.grid-product__tag.grid-product__tag--sold-out {
display: none;
}
It doesn’t seem to be working. The price is still showing
I’m having the same issue. Trying to hide sold prices. Any update on this? Many thanks
@Acerino3
hi, we are happy to help you.
please share me your Site url
Thank you.
Mima-shoppe.myshopify.com
Hi @Acerino3
Share the url, so that i can look into this.
Mima-shoppe.myshopify.com
@Acerino3 , As i can see, i need to go through your code and conditionally hide the price and other stuff you wanted. You can PM me
Please follow the steps:
- Step 1: Go to Online store > Themes > Actions > Edit code.
- Step 2: Go to Assets > theme.css and paste this at the bottom of the file:
.grid-product__tag--sold-out~.grid-product__link .grid-product__price {
display: none;
}
.grid-product__tag--sold-out~.grid-product__link .grid-product__image-mask{
opacity: 0.3;
}
I added your code to file theme.css.liquid
But no change, price still shows up and product picture hasnt been opacified. Please help
here is that last bit of code:
.template-giftcard .logo{
color:#58686f;
}
.grid-product__tag--sold-out~.grid-product__link .grid-product__price {
display: none;
}
.grid-product__tag--sold-out~.grid-product__link .grid-product__image-mask{
opacity: 0.3;
}
}
Hi @Acerino3
Try this, not tested.
.template-giftcard .logo{
color:#58686f;
}
.grid-product__tag--sold-out~.grid-product__link .grid-product__price {
display: none !important;
}
.grid-product__tag--sold-out~.grid-product__link .grid-product__image-mask{
opacity: 0.3 !important;
}
}
I tried yours also. Nothing happened. Thank you for trying
The above code working perfectly, have a look. If still, you have a problem, let me know. Have you tried hard refresh or tried in a private window?
I tried hard refresh and other computers and tablets. The price is still showing and the product image is not opacified. I'm not sure why its not working for me
Did this ever get resolved?
mima-shoppe.myshopify.com
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024