Occasionally, in some WordPress themes, the themes use icons from sources such as Font Awesome and if there is an issue loading them in, they might show up as boxes or squares. This usually happens when the icons are loaded in from a different website.
Method 1
Font Awesome is a popular icon library that most themes use. Installing the Font Awesome plugin is the easiest method and usually, resolves icon issues.
- Start by going to the Plugins page and select Add New.
- Search for Font Awesome
- Download, and Activate
If this doesn’t fix your issue, continue to Method 2.
Method 2
Sometimes, caching plugins interfere with fonts and icons. Try disabling any caching plugins to see if that solves the icon issues.
If this doesn’t fix your issue, continue to Method 3.
Method 3
Lastly, the htaccess files may block icons from loading in properly.
- Go to your hosting file manager (see steps here)
- Look for the .htaccess file (it might be hidden)
- Edit it using your file manager’s built-in text editor.
- Add this code into your file: (Tip: The system does not read text that starts with a pound (this: #)
# Apache config
<FilesMatch ".(eot|ttf|otf|woff)">
Header set Access-Control-Allow-Origin "*"
</FilesMatch>