Docs

[UMonte]

Hi, I’ve searched the forum and tried suggestions, but didn’t work.
Here’s what I put in Appearance > Customizer > Custom CSS

.x-social-global a {
color: #000000;
}
.x-social-global a:hover {
color: #0000ff;
}

I saved and refreshed, and even tried another browser but the icon colors remained red (integrity).
Can you help me?

[Joao]

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[UMonte]

I’m developing my site on localhost. I tried opening port 80 to allow income connections, but it seems that my ISP doesn’t allow that – I’m going to give them a call.
I could also upload my site to my provider if that’s absolutely necessary.
Meanwhile, can’t you give me any hint? Is that code right?

[Rahul]

Hey There,

Thanks for writing in!

The code is right and will work for you. Unfortunately, we can’t assist you properly as we don’t have the site URL to take a closer look.

Thanks for your understanding!

[UMonte]

Hello guys! First of all your support has been great!

To recapitulate what I want (as I know it’s not the same persons who answers in a thread):

I want to change the color of the social media icons.
I got the code below, and I said it didn’t work, but now I realized it WORKS, but ONLY in the top bar.
I want to change the color of the icons when I insert them in a page!

.x-social-global a {
color: #000000;
}
.x-social-global a:hover {
color: #0000ff;
}

See the attached picture. The ones on the topbar are black and hover blue, but the ones in the page didn’t change.
Thanks!

[Lely]

Hi There,

Thank you for the clarification. That is a different element with different structure thus needed different CSS. Please add custom-social-sharing on the element class field. Then add the following CSS on Appearance > Customize > Custom > Edit Global CSS:

.custom-social-sharing .x-share:hover {
    color: #0000ff !important;
}
.custom-social-sharing .x-share {
    color: #000000;
}

Hope this helps.

[UMonte]

It worked! Thanks so much!

[Joao]

Glad to hear it,

Joao

[Author]

Posts