Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • August 2, 2023 at 7:53 pm #1415279
    sarthakchoudhary

    Hi there, I want to change the colour of social icon in my footer of the website. And also remove text the is visible when we hover on it.

    August 2, 2023 at 10:12 pm #1415289
    Rikard

    Hey sarthakchoudhary,

    Please try the following in Quick CSS under Enfold->General Styling:

    #footer-page .av-social-sharing-box .av-share-link .avia-related-tooltip {
  display: none; 
}

#footer-page .av-social-sharing-box.av-social-sharing-box-icon .av-share-box ul li a {
  color: red;
}

    Best regards,
    Rikard

    August 3, 2023 at 6:23 am #1415307
    sarthakchoudhary

    I tried using this code but there was no change on the website.

    August 3, 2023 at 2:26 pm #1415335
    Yigit

    Hi,

    Please try using the first code as the following:

    
#footer-page .av-social-sharing-box .av-share-link .avia-related-tooltip {
  display: none !important;
}

    The second code should have worked. Please make sure to clear any server-side, plugin-based, and browser caches. If that doesn’t help, please check your custom CSS for errors. You can use this website http://csslint.net/ to do that.

    If the suggestions above don’t work, please create temporary admin logins and share them with us in the private content field.

    Best regards,
    Yigit

    • This reply was modified 1 year, 2 months ago by Yigit.
    August 4, 2023 at 11:05 am #1415408
    sarthakchoudhary

    Hi the first code is working now. Also the code you shared for the colour of icon is also working. But I wanted to change the bg colour of the icon, not the icon itself. So sorry for the confusion. Can you pls share code to change the bg of the icons in footer ?

    August 4, 2023 at 8:58 pm #1415452
    Rikard

    Hi,

    Thanks for the update. Do you mean the background colour in the hover state?

    Best regards,
    Rikard

    August 4, 2023 at 9:13 pm #1415460
    sarthakchoudhary

    No bg without hover. Like its currently white but I want to change it to black

    August 4, 2023 at 9:21 pm #1415463
    sarthakchoudhary

    Also the mail icon is not visible there. I have used the social icon element there.

    August 5, 2023 at 9:12 am #1415489
    Nikko

    Hi sarthakchoudhary,

    I tried to check your website’s footer and there are only 3 social icons, twitter, linkedin, and instagram, the mail icon is not added.
    Also, the social icons are already in black, is this already fixed?

    Best regards,
    Nikko

    August 5, 2023 at 8:17 pm #1415615
    sarthakchoudhary

    Yes that’s the issue. Mail icon is not visible. Also I want to change the bg colour of the icon not the icon colour.

    August 5, 2023 at 10:10 pm #1415625
    Mike

    Hi,
    Thank you for the link to your site, the mail icon is not showing because you have not added it to your Enfold Theme Options ▸ Social Profiles ▸ Your social profiles
    Enfold_Support_2828.jpeg
    I have added this for you but you should change the email address to the one you want to use.
    To have the social icons in the footer show the background colors all of the time I added this css to your Enfold Theme Options ▸ General Styling ▸ Quick CSS field

    #top #wrap_all .av-share-box .av-social-link-mail a{color:#fff; background-color:#9fae37; }
#top #wrap_all .av-share-box .av-social-link-twitter a{color:#fff; background-color:#46d4fe; }
#top #wrap_all .av-share-box .av-social-link-linkedin a{color:#fff; background-color:#419cca; }
#top #wrap_all .av-share-box .av-social-link-instagram a{color:#fff; background-color:#a67658; }

    Enfold_Support_2830.jpeg
    please clear your browser cache and check.

    Best regards,
    Mike

    August 7, 2023 at 3:33 pm #1415717
    sarthakchoudhary

    Thank you sm. I tried changing the mail ID in social as you asked but it’s still directing to my personal inbox and not to a new thread redirecting to my company’s mail. Can you pls check that also ?

    August 7, 2023 at 6:30 pm #1415731
    Mike

    Hi,
    I see that you added your email address at Enfold Theme Options ▸ Social Profiles ▸ Your social profiles ▸ Special: Email Icon and when I tested the mail icon on the frontend it worked correctly by opening a new email message with your email address in the “to” line. I assume that the gmail address you added is your company email.
    A mailto link opens the users email client with a new message for the email address.
    What are you expecting?
    You could have the link direct to a contact form on your site if you wish, just replace the mailto link with a url to the page with the contact form.

    Best regards,
    Mike

    August 11, 2023 at 8:41 am #1416026
    sarthakchoudhary

    Okay thank you guys its working now

    August 11, 2023 at 11:55 am #1416055
    Mike

    Hi,
    Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 15 posts - 1 through 15 (of 15 total)
  • The topic ‘Change colour of social icons in footer.’ is closed to new replies.