Product Labels color

This topic has 16 replies, 4 voices, and was last updated 5 years, 8 months ago by Elise Noromit.

Viewing 17 posts - 1 through 17 (of 17 total)

Author

Posts
April 5, 2018 at 6:41 pm #51072

Jarda
Participant

Hi.
I created one own product attribute label. I changed backround and font color for this label: .product-label.attribute-label:not(.label-with-img) {
background-color: rgba(213, 43, 151, 0.9);
color: #fff;
}
It works fine.

My question is: If I create multiple values for own label, they will all have the same background color and fonts. How do I set different colors for values of own attribute labels?

April 6, 2018 at 6:03 am #51115

Artem Temos
Keymaster

Hi,

Each attribute label has its own unique CSS class and you can use them to change the color. Could you please send us a link to your shop page so we can give you an example of that class?

Regards

April 6, 2018 at 6:43 am #51135

Jarda
Participant

Of course. Thanks.

April 6, 2018 at 6:49 am #51139
Artem Temos
Keymaster
Use this code for example
```
.label-term-skladem {
	background-color: red!important;
}

.label-term-vyprodej {
	background-color: green!important;
}
```
April 6, 2018 at 7:05 am #51144

Jarda
Participant

How simple 🙂 Thanks.

I still have one question for the product details rectangular labels. In Mozilla and Safari browsers, the label on the right is not aligned with the image. After loading, the image moves to the left. Do you see that anyway?

April 6, 2018 at 8:18 am #51155

Elise Noromit
Member

Hello,

Here is the view from Chrome http://prntscr.com/j1m3d6

and here is Mozilf view http://prntscr.com/j1m7rr

All the labels are on the left. Please clarify the issue.

Best Regards

April 6, 2018 at 8:24 am #51158

Jarda
Participant

I meant the single product detail page.

April 6, 2018 at 8:53 am #51163

Elise Noromit
Member

Hello,

I have checked the single product page:

Chrome http://prntscr.com/j1moeo on the right

Mozilla http://prntscr.com/j1mo3g on the right

Best Regards

April 6, 2018 at 9:09 am #51166

Jarda
Participant

So we see it the same way. The label is not aligned with the image. Not solve it.

Thank you for great support.

April 6, 2018 at 10:07 am #51185
Elise Noromit
Member
Hello,

Please inform where did you expect it should be? Take any screen and sign out.

Try this CSS code:
```
.product-image-summary .product-images .labels-rectangular {
    top: 15px;
    left: auto;
    right: 0;
    margin-right: 2px;
}
```
Is it what you need?

Best Regards
April 6, 2018 at 10:31 am #51194

Jarda
Participant

https://www.dropbox.com/s/jc4zbrkw453urk3/prtscrn-label-align.jpg?dl=0

April 6, 2018 at 10:36 am #51195

Jarda
Participant

Great, it works.

Thanks

April 6, 2018 at 11:13 am #51206

Elise Noromit
Member

You are always welcome. If you have any questions feel free to contact us.

Best Regards

March 15, 2019 at 4:03 pm #113212

janice_summer
Participant

Hi,

I can’t translate those labels with WPML.
There is no “string translations” for this.
How can I translate them, I have three languages ?

thx

March 15, 2019 at 8:45 pm #113241

Elise Noromit
Member

Hello,

Please provide your site admin access. The site access you provided earlier does not have WPML.

Best Regards

March 16, 2019 at 7:50 am #113271

janice_summer
Participant

Hi,

I provided the admin login (with a changed password in the second post) here:
https://xtemos.com/forums/topic/urgent-site-crashes-with-500-internal-server-error/

regards

March 16, 2019 at 10:50 am #113293

Elise Noromit
Member

Hello,

Try this string please http://prntscr.com/mynffj

Best Regards
Author

Posts