Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1036093

    How can I change the colour of the top header and how can I change the colours of the social media icons, also the hovering?
    I just need the css codes for that and where to insert them.

    Thanks for your help! :)

    #1036672

    Hey transformmedia,

    For the top header, you can modify it in Enfold > General Styling > Logo Area (tab) > Alternate Background color.
    As for the social media icons, the first codes are for changing their colors and background color, the 2nd one is still for changing colors and background colors when they are hovered.
    Youtube:

    #top #wrap_all .av-social-link-youtube a {
        color: #fff;
        background-color: #a72b1d;
    }
    
    #top #wrap_all .av-social-link-youtube:hover a {
        color: #fff;
        background-color: #a72b1d;
    }

    Facebook:

    #top #wrap_all .av-social-link-facebook a {
        color: #fff;
        background-color: #37589b;
    }
    
    #top #wrap_all .av-social-link-facebook:hover a {
        color: #fff;
        background-color: #37589b;
    }

    Instagram:

    #top #wrap_all .av-social-link-instagram a {
        color: #fff;
        background-color: #a67658;
    }
    
    #top #wrap_all .av-social-link-instagram:hover a {
        color: #fff;
        background-color: #a67658;
    }

    Hope this helps.

    Best regards,
    Nikko

    #1117902

    Can you help me please to remove the hover effect of the social icon on the header?

    #1117957

    Hi sbarino,

    Thanks for providing the link :)
    Can you try adding this css code in Quick CSS:

    #top .av-logo-container .social_bookmarks li a {
        border-radius: 0 !important;
    }
    
    #top #wrap_all .av-social-link-instagram:hover a {
        background-color: transparent !important;
        color: #a7a7a7 !important;
    }

    Best regards,
    Nikko

    #1118132

    Thank you very much, Nikko. It worked like a charm.
    Best regards.

    #1118219

    Hi sbarino,

    Glad we could help :)

    If you need further assistance please let us know.
    Best regards,
    Victoria

    #1439694

    That CSS works great for the standard social icons, but I can’t figure out what the input is for “Special: Email icon”. The default green does not work with the companies brand.

    #1439719

    Hi,

    You can use the following css code to adjust the style of the Special: Email Icon:

    #top #wrap_all .av-social-link-mail:hover a {
        background-color: transparent !important;
        color: #a7a7a7 !important;
    }

    If you need more assistance, please feel free to open another thread.

    // https://kriesi.at/support/forum/enfold/#new-post

    Best regards,
    Ismael

Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Changing the color of the top header / social media icons?’ is closed to new replies.