Navigation
Archive / Changing Nav Bar social icon color on a particular page only.
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • October 14, 2016 at 3:31 am #1215881
    Jason
    Participant

    Hi There,

    I have a site and added social icons to the nav menu. Perfect. The colo of the social icons are not right for the HOMEPAGE only but are good for the rest of the pages (this is because of the header image I am using on the homepage)

    Question is: I want to change the color of the social icons used (FB, Twitter and Pinterest) on the HOMEPAGE ONLY. How do I go about doing this? I have tried a few custom CSS tweaks on the page specific custom css with no luck. Can you help me here?

    Thanks 🙂

    October 14, 2016 at 3:39 am #1215892
    Paul R
    Moderator

    Hi,

    To change its color in the homepage, you can add this under Custom > CSS in the
    Customizer.

    
.home .x-topbar .x-social-global a {
    color: Red;
}

    Change red with the color that you like.

    Thanks

    October 28, 2016 at 6:03 am #1234653
    Jason
    Participant
    This reply has been marked as private.
    October 28, 2016 at 9:55 am #1234834
    Joao
    Moderator

    H Jason,

    Seems like you have added an inline CSS code to your icons:

    <i class="x-icon-facebook" style="color: #403f5e; font-size: 16px; margin: -14px -5px 0 0;" data-x-icon="ï‚š"></i>

    Change #403f5e for white and you will get your result.

    Hope that helps

    Joao

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1215881 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>