1
votes

I'm working on a website (using Divi) and the icons don't show up correctly when I activate the child theme.

I've attached a picture to show the problem I am having:

enter image description here

This only happens when I activate the child theme, when I go back to the Divi theme, everything goes back to normal.

Additional info:

  • I used a Divi child theme generator for the child themes.
  • I used CSS and Elegant Themes Icon codes for the Icons.

Here is an example of the CSS I use for the icons:

.menu-donate:before {
    font-family: 'ETmodules';
    content: "\e089";
      color: #2a2f36;
        margin-right: 6px;
        margin-top: -2px;
    float: left;
}

How can I make the icons compatible with the Divi child theme?

Thanks in advance

3
Turning on the option for Dynamic Modules in the Performance Settings fixed this issue for me.OG Sean

3 Answers

1
votes

I figured it out, after activating the child theme, the CSS was changed and the "\" was removed from the "\e089".

I added the "\" back in and it's working normally.

0
votes

Check your developer console for scripts/css that are not loading properly.

0
votes

I was having a similar issue with icons not showing up in my Divi child theme. The solution I found that worked for me is this: Place the following in your .htaccess file:

# ----------------------------------------------------------------------
# Webfont access
# ----------------------------------------------------------------------
# Allow access from all domains for webfonts.
# Alternatively you could only whitelist your
# subdomains like "subdomain.example.com".
<IfModule mod_headers.c>
  <FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font.css|css|js)$">
    Header set Access-Control-Allow-Origin "*"
  </FilesMatch>
</IfModule>