Icon Issues

I’m still having icon issues on multiple sites. They are either not displaying at all or displaying a square. I’m using default X theme or Pro theme elements to display the icons in header and footer.

The issue is displaying in social media elements, buttons with graphics, and menu elements sub indicator.

  • I’ve updated to the most recent versions of Pro and X

  • I’ve cleared caching plugins and cleared X’s style cache

  • I tested for plugin conflict

  • And I’m not using custom css

Please help, thanks!

Hi,

In the latest version, Font Awesome was updated. This involved changing markup css and file locations.
Since clearing cache didn’t solve this issue, it is most likely that you have some custom in your child theme that needs updating.

Kindly check all files in your child theme and replace all instances of data-x-icon with icon attribute to one of the following:

data-x-icon-b for social icons.
data-x-icon-o for outline icons.
data-x-icon-s for solid icons.

The original attribute data-x-icon will still work for solid icons as a fallback but we’ve updated everything for consistency.

eg. Change this

  <i class="x-icon-bars" data-x-icon="&#xf0c9;"></i>

with this

  <i class="x-icon-bars" data-x-icon-s="&#xf0c9;"></i>

Hope that helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.