While working on a draft of my recent Code Louisville website project I was checking the layout on my iPhone, and I noticed that the Font Awesome icons would not load on my iPhone.
Font Awesome Icons
The green area of the site should look like this with a large graphic icon from Font Awesome above each text area. But, that’s not what I saw.
Font Awesome Icons Missing
When I opened the website on my iPhone, it actually looked like this.
You can see the text, but the graphic icons are missing.
The culprit turned out not to be a coding issue, but an ad blocker app on my iPhone. In my case, it was 1Blocker.
How do you fix this?
Go to Settings -> Safari -> Content Blockers -> 1Blocker
Turn the app off by flipping the green button to off for 1Blocker. Reload your website, and your Font Awesome Icons will then appear again.
This can also be an issue on your laptop or desktop if you use AdBlockerPlus. While many people enjoy the ad blocking features of these apps, they obviously can and do restrict otherwise legitimate content on websites.
