Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #511911

    How do I change the background circles colors for the social icons? Is there a way to have each one a different color?

    #512020

    Hey mcraig77,

    Could you provide us with a link to the site in question so that we can take a closer look please? What colours would you like?

    Regards,
    Rikard

    #512027

    My site is in maintenance mode but you can access it with the private data.

    #512158

    Hi!

    Please add following code to Quick CSS and adjust as needed

    #top #wrap_all .av-social-link-instagram a {
        color: #fff;
        background-color: #a67658;
    }
    #top #wrap_all .av-social-link-facebook a {
        color: #fff;
        background-color: #37589b;
    }
    #top #wrap_all .av-social-link-twitter a {
        color: #fff;
        background-color: #46d4fe;
    }

    Best regards,
    Yigit

    #512462

    thanks! but I wanted the icons to not have a circle normal and on rollover the color… that code is for normal circle…

    #512606

    Hi,

    Try the following as well:

    #header_main .social_bookmarks li a {
        border-radius: 0px !important;
    }

    Thanks,
    Rikard

    • This reply was modified 9 years, 3 months ago by Rikard.
    #512972

    not quite. What I want is the following:

    I want the icons black without a circle normal.

    On hover I want the icons white and the background hover circle a custom color…

    Please advise.

    #513450

    Hey,

    Please try the following:

    #top .social_bookmarks li a {
        color: black !important;
        background-color:transparent !important;
    }
    
    #top .social_bookmarks li a:hover {
        color: white !important;
        background-color:black !important;
    }

    Regards,
    Rikard

    #513457

    OK cool … but how do I get each icon to have a different hover background circle color?

    #513724

    Hi!

    Please add following code to Quick CSS and adjust as needed

    #top #wrap_all .av-social-link-instagram:hover a {
        background-color: #a67658;
    }
    #top #wrap_all .av-social-link-facebook:hover a {
        background-color: #37589b;
    }
    #top #wrap_all .av-social-link-twitter:hover a {
        background-color: #46d4fe;
    }

    Regards,
    Yigit

    #514087

    Perfect!

    #514096

    When I clock on one of these icons not there is a line underneath the icon… how do I have this not happen?

    See screenshot

    #514575

    Hey!

    Please add following code to Quick CSS as well

    #top #header_main .social_bookmarks li a {
        text-decoration: none!important;
    }

    Best regards,
    Yigit

Viewing 13 posts - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.