-
AuthorPosts
-
November 26, 2020 at 9:52 pm #1263371
Dear Team,
I tried many of the previously listed solutions, but unfortunately none of them worked on my site. I increased the social icons’ sizes, but the colored background on hover did not do the same – thus I would like to remove the hover background.
Additionally I would like to insert a phone icon before the actual phone number. Please see the site in the private section.
Can you advise me how to do this?
Many thanks!
November 29, 2020 at 5:32 am #1263731Hey dkarvasz,
Sorry for the late reply and thanks for the link to your site.
To remove the background color from the header social icons you could use this css:#top #wrap_all .social_bookmarks > li:hover a { background-color: transparent !important; }But I believe that your background color issue could be solved with this css, please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:
#top .social_bookmarks li a { border-radius: 100px; } #header .social_bookmarks li a { line-height: 40px !important; } #top .social_bookmarks { margin: 10px 0 0 -9px !important; }After applying the css, please clear your browser cache and check.
I see that you have added your phone number to the Enfold Theme Options > Header > Extra Elements > Phone Number or small info text field and you also have Font Awesome code there, to use this to should install the Font Awesome plugin it should work right away for you.
Or you can insert a phone icon before the actual phone number with this shortcode:
[av_font_icon icon='ue854' font='entypo-fontello' size='20px'][/av_font_icon]Best regards,
MikeNovember 30, 2020 at 1:14 pm #1263958Hi Mike,
Thank you for the tips, both solved my issue and extra thanks for the circled background, it gives a nice final touch – better than no hover bg at all :)
Cheers,
DanielNovember 30, 2020 at 1:44 pm #1263965Hi,
Glad to hear, unless there is anything else we can help with on this issue, shall we close this then?Best regards,
MikeNovember 30, 2020 at 1:46 pm #1263966All solved, so can be closed, thanks :)
December 1, 2020 at 2:09 am #1264097Hi,
If you need additional help, please let us know here in the forums.
Best regards,
Jordan Shannon -
AuthorPosts
- The topic ‘Top bar social icons : remove background on hover + add phone icon’ is closed to new replies.
