the icons from library linked to the Namos theme: http://fontawesome.io/icons/ are not displayed in my website, please have a look at the attached PDF.
Actually, in the theme's live preview (http://wpdemo.oceanthemes.net/namos/) the social media icons change colour when the users hovers over them (turquoise for twitter, orange for Google+, etc)
Could you please show me how to achieve both options?
Hi guys,
the icons from library linked to the Namos theme: http://fontawesome.io/icons/ are not displayed in my website, please have a look at the attached PDF.
Actually, in the theme's live preview (http://wpdemo.oceanthemes.net/namos/) the social media icons change colour when the users hovers over them (turquoise for twitter, orange for Google+, etc)
Could you please show me how to achieve both options?
1. Correctly son who icons from http://fontawesome.io/icons/
2. Colour change when user hovers (as on the live theme preview).
Thanks!,
Alejandro Fuentes.
Hi,
1.Like our demo, Icon don't show. That's title that you put in social network name.
follow: https://www.awesomescreenshot.com/image/3116389/d3abc7b74e5e784d6b6eced720b3f9a7
2. You can input to "icon class name\" to style. And we avaiable some class as: "google", "facebook", "twitter", "envato" you can input this classes.
follow: https://www.awesomescreenshot.com/image/3116405/05530f6e25b15982fd02b720091d7754
Or You can go to Appearance/Customizer/Additional Css => add css to change color hover.
ex: with icon class name is linkedin & instagram
.nav-social li a.linkedin:hover {
color: your-color;
}
.nav-social li a.linkedin:before {
background-color: your-color;
}
.nav-social li a.instagram:hover {
color: your-color;
}
.nav-social li a.instagram:before {
background-color: your-color;
}
Hi guys,
thanks for the instructions. I used the custom CSS solution, nevertheless:
1. The changes are only visible on the main menu, but not on the footer links.
2. The bullet point in the menu remain white even once the user is hovering.
How can I apply the colour change to the footer items too? and make the bullet point either disappear or to change color as well?
Thank you.
Hi,
1. footer. Add css code
.footer-social li a.linkedin:hover {
color: your-color;
}
.footer-social li a.instagram:hover {
color: your-color;
}
.footer-social li a.linkedin:before {
background-color: your-color;
}
.footer-social li a.instagram:before {
background-color: your-color;
}
2. Bullet.
you can add css
.nav-social li a.linkedin:before {
background-color: your-color;
}
.nav-social li a.instagram:before {
background-color: your-color;
}