Access a community of over 900,000 Shopify Merchants and Partners and engage in meaningful conversations with your peers.
How can I change the appearance of sold out products in the collection / home page from the small badge on the top corner as you can see in the attached image?
My website URL is twistedfriends.com
Solved! Go to the solution
This is an accepted solution.
hello @rodriiiv1
please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.
.template-index .ProductItem__LabelList {
position: absolute;
left: 50% !important;
top: 50% !important;
text-align: left;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
Please Go to Online Store->Theme->Edit code then go to assets/theme.scss.liquid ->paste below code at the bottom of the file.
.template-index .ProductItem__LabelList {
position: absolute;
top: 50% !important;
text-align: center;
left: 38% !important;
}
Thanks!
Hii, @rodriiiv1
Paste this code on top of the theme.scss file.
.ProductItem__LabelList {
position: absolute;
left: 35% !important;
top: 40% !important;
text-align: left;
}
Thank You.
This is an accepted solution.
hello @rodriiiv1
please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.
.template-index .ProductItem__LabelList {
position: absolute;
left: 50% !important;
top: 50% !important;
text-align: left;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
User | RANK |
---|---|
192 | |
104 | |
76 | |
63 | |
60 |