Social Media Icons Shape Change Upon Hover

[Bilal Sadiq]

How and where do I put the code for social media icons to change shape upon hover (from circle icon to square with rounded corners). Theme is bizness pro.

Secondly, I cant remove the category and archives showing vertically on Home page

[Sonl Sinha]

Hi,

Kindly show us your website URL so that we can assist further.

Regards,
Dave

[Bilal Sadiq]

url is akhtarz.com

how can I upload a picture here to show hover social media icons?

[Sonl Sinha]

Hi,

Kindly go to Appearance>>Theme Options>>Basic Settings>>Custom CSS Box:

Add this code there:

.header-follow-us .social-icons a { border-radius:100% !important; transition:all 0.5s ease-in-out 0s;}
.social-icons a:hover { border-radius:6px !important;}

Regards,
Dave

[Alice Kaal]

Hello,

How can I get social media icons in the header (in line of the logo, but on the right side of the screen, above menu).

The social icons in the footer link to http://socialmediahuis.nl/www.facebook.com/socialmediahuis/ instead of www.facebook.com/socialmediahuis/. So the 404-page is showing. How can I fix that?

My website is www.socialmediahuis.nl

Thanks in advance!

[Sonl Sinha]

Hi,

Kindly use this shortcodes there.

[social_area]
[social icon="facebook" link="https://www.facebook.com/socialmediahuis/"]
[social icon="twitter" link="https://twitter.com/socialmediahuis/"]
[social icon="instagram" link="https://www.instagram.com/socialmediahuis/"]
[/social_area]

Regards,
Dave

[Alice Kaal]

Hi Dave,

That doesn’t work in the footer widget and I want to use my own icons.

The ones are in the footer now, but they automatically link to www.socialmediahuis.nl/www.facebook.com/socialmediahuis instead of www.facebook.com/socialmediahuis.

Despite of what I type in the code:

<a href="www.facebook.com/socialmediahuis/"><IMG SRC="http://socialmediahuis.nl/wp-content/uploads/2017/08/facebook.png" width="50" height="50" /></a>&emsp;<a href="www.twitter.com/socialmediahuis/"><IMG SRC="http://socialmediahuis.nl/wp-content/uploads/2017/08/twitter.png" width="50" height="50" /></a>&emsp;<a href="www.instagram.com/socialmediahuis/"><IMG SRC="http://socialmediahuis.nl/wp-content/uploads/2017/08/insta.png" width="50" height="50" /></a>

Can you help me properly?

[Sonl Sinha]

Hi,

Kindly send us your WordPress admin details (Username & Password) via sktthemes.net/contact Please mention this forum URL while replying so that we understand what needs to be done.

Regards,
Dave

[Sonl Sinha]

Hi,

This issue was resolved from our end. Kindly check and confirm.

Regards,
Dave

[Bilal Sadiq]

Thanks dave, the shape changes upon hovering mouse, I would also like to change the color upon hover, official blue of facebook, twitter, linkedin and red of google plus. please support.

[Sonl Sinha]

Hi,

Can you send us the screenshot of your issues? Upload your screenshot on imgur.com and paste the share url here.

Regards,
Dave

[Bilal Sadiq]

see the linkedin icon changes shape as well as color upon hover.

https://i.imgur.com/JlnptC0.png

Need to know code for custom color change.

https://stackoverflow.com/questions/25770590/change-color-when-hover-a-font-awesome-icon
Run code snippet, that also might clear my query.

[Sonl Sinha]

Hi,

Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

Add this code there:

.fa.fa-facebook.fa-1x {background: #3b5998 !important; color: #fff !important; border: none !important;}
.fa.fa-twitter.fa-1x {background: #1ea1f3 !important; color: #fff !important; border: none !important;}
.fa.fa-linkedin.fa-1x {background: #0077b4 !important; color: #fff !important; border: none !important;}
.fa.fa-google-plus.fa-1x {background: #dc4c41 !important; color: #fff !important; border: none !important;}

Regards,
Dave

[Author]

Posts