0
Answered

How can I change the color of the social media icons and their size on my home page?

JDNaturalsFL 2 years ago updated by support (Support) 3 months ago 3

The social media icons do not contrast well with the background on my page and I would like them to be a little bit bigger.

Answer

Answer
Answered

Hello JDNaturalsFL,

You will need to add some code in the Customizer under the Custom Theme CSS section (in Advanced).  Here is the code:

.palette-primary li.menu-social > a {
color: #123456 !important;
font-size: 5em;
}

You will need to play with the values for color and font-size until you find the right ones for your site.  You can simply use the Google search engine to find the hex value to get the color you wish to use.

If you have any further questions or comments, please let us know.


Kindest regards,

Arnel C.

 

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              

Answer
Answered

Hello JDNaturalsFL,

You will need to add some code in the Customizer under the Custom Theme CSS section (in Advanced).  Here is the code:

.palette-primary li.menu-social > a {
color: #123456 !important;
font-size: 5em;
}

You will need to play with the values for color and font-size until you find the right ones for your site.  You can simply use the Google search engine to find the hex value to get the color you wish to use.

If you have any further questions or comments, please let us know.


Kindest regards,

Arnel C.

 

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              

Hi Arnel, sorry to jump on an old thread...  When I use the CSS you suggested above, the icon size changes but the colour doesn't change no matter what is entered. Any help would be appreciated.

Sorry to hear that code did not work as expected for you and we are happy to help you get things working! If possible, could you send us a link to your website? With that information we should be able to see what is going on from the front end and help you get those icon colors changed! Thank you for your patience and we look forward to hearing back from you soon.