Move discount label

How can i move the discount price label in the top right corner of products grid?

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body .labels-rectangular .onsale { 
display:none; 
}

This would remove the sales label, if you want to move to another place, it is not possible to move this only label. I can move all labels.

Best Regards

I want to move it not to remove it!

Hello,

Please provide your site admin access to the private area.

Do you have this label only? I can provide the custom CSS to move all the labels. Please specify where you want to move it?

Best Regards

I only have the discount label. I want to move it on products grid on the top right corner. Give me CSS.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

/*round label*/

body .labels-rounded {
    top: 7px;
    left: auto;
    right:7px;
}

/*rectangular*/

body .labels-rectangular{
    top: 7px;
    left: auto;
    right:7px;
}

Best Regards

Since i have decided to go with the rounded one, what is the code to make it smaller both on dekstop and mobile?

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body .labels-rounded .product-label {
    min-height: 50px;
    width:50px;
    font-size: 14px;
    border-radius:50%;
    padding:0;
}

Change the styles as per your needs.

If you have any questions please feel free to contact us.

Best Regards

This code doesn’t work very well. No matter what style i give it, the circle gets as an elipse and i just want to be smaller.

In fact, the width margin doesn’t work.

Hello,

Sorry for the delay. We have had a technical issue on the forum, your topic was not visible.

Please provide your site admin access or try this code:

body .labels-rectangular .product-label {
    min-height: 50px;
    width:50px;
    font-size: 14px;
    border-radius:50%;
    padding:0;
}

Best Regards

[Author]

Posts