- This topic has 13 replies, 5 voices, and was last updated 4 months, 2 weeks ago by
Leo.
-
AuthorPosts
-
October 7, 2020 at 11:15 am #1477133
Timea
Hello,
How do I add a social media icon to the navigation bar? Thank you.
October 7, 2020 at 11:32 am #1477165Leo
StaffCustomer SupportHi there,
This is the easiest solution:
https://docs.generatepress.com/article/adding-icons-to-menu-items/Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/October 7, 2020 at 12:50 pm #1477327Timea
Hello,
I tried adding it manually from the Custom links. I’ve copied the URL, the navigation label and CSS too but it doesn’t appear on my menu. Am I missing something?
October 7, 2020 at 7:42 pm #1477676Leo
StaffCustomer SupportAre you using the fa method?
If so make sure you install and activate the FA plugin:
https://wordpress.org/plugins/font-awesome/Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/October 8, 2020 at 5:29 am #1478313Timea
Yes, I’m using the FA method. I installed the plugin and it shows in the navigation bar but I tried for Home page, Linkedin etc and it’s all the same icon. It doesn’t include the FA icons. And also when I click on it, it goes out from my site, I wanted to open it in a new page.
October 8, 2020 at 6:27 am #1478388David
StaffCustomer SupportHi there,
can you share a link to your site so we can see what the issue is
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/October 8, 2020 at 11:04 am #1479011Timea
Hi,
Thanks for checking, please see the link in the private section.October 8, 2020 at 4:33 pm #1479378Elvin
StaffCustomer SupportHi,
I’ve read through the scripts on your site and it doesn’t seem to be properly importing the icons. It’s importing from a locally hosted url.
Also, it seems pretty outdated (4.7.0). Are you using the plugin now?
Can you try removing the previous one you’ve added and use the latest version of the FontAwesome plugin?
The newest version is using 5.15.1 and should also include the proper import styles and prefetch headers.
After applying all this, please purge the site and browser cache and let us know what you see.
A wise man once said:
"Have you cleared your cache?"October 9, 2020 at 5:24 am #1480202Timea
Hi,
Thanks for checking.
I tried with and without installing the plugin too. I’ve deleted and re-installed the Better FontAwesome (which seems to be the latest version).
I cleared up the browser cache.The icon is still the same, it’s showing up but not with the selected icon.
October 9, 2020 at 10:00 am #1480787Tom
Lead DeveloperLead DeveloperHi there,
You’re loading Font Awesome 4.7.0:
<link rel='stylesheet' id='bfa-font-awesome-css' href='//cdn.jsdelivr.net/fontawesome/4.7.0/css/font-awesome.min.css?ver=4.7.0' media='all' />
However, the icon in your menu is using
fab
, which is for Font Awesome 5.x: https://www.screencast.com/t/6WK9Re7lIf you want to use 4.7.0, you need to do this:
fa fa-linkedin
Of course, it would be better to load the latest version of Font Awesome and continue using
fab fa-linkedin
.Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentOctober 10, 2020 at 7:04 am #1481920Timea
Hello,
Many thanks for your assistance, i changed from fab to fa and it finally the icon shows up!
As per your suggestion, I would prefer to load the latest version.
Could you please send a link to the plugin?
As the one I used, seemed to be the latest, at least I couldn’t find more updated version. I used Better Font Awesome from Mickey Kay.
To get rid of older version references, I reckon I would just need to delete the plugin.
October 10, 2020 at 7:23 pm #1482692Leo
StaffCustomer SupportThis is the official FA plugin so it should load the latest version:
https://wordpress.org/plugins/font-awesome/Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/October 11, 2020 at 5:32 am #1483145Timea
Thanks for that, I’ve been installing another version that seemed to be the latest one.
But I tried the one you sent and it worked.
Thanks a lot for all the support from the team!October 11, 2020 at 7:48 am #1483347Leo
StaffCustomer SupportNo problem 🙂
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.