Shopify themes, liquid, logos, and UX
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 |
---|---|
235 | |
155 | |
60 | |
55 | |
47 |
Thanks to all who participated in our AMA with 2H Media on planning your 2023 marketing bu...
By Jacqui Mar 30, 2023Thanks to all Community members that participated in our inaugural 2 week AMA on the new E...
By Jacqui Mar 10, 2023Upskill and stand out with the new Shopify Foundations Certification program
By SarahF_Shopify Mar 6, 2023