Search code examples
wordpressfavicon

How to fix icons not showing in frontend wordpress


In frontend, some icons are not working : fontawsome icons and also the icons in the admin bar but only in frontend. In backend, I can see all the icons.

In custom css I found this :

@import url('https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');

body { color:#4c5166;
font-weight:400;
} 


* { font-family: 'Montserrat', sans-serif !important;
}

and also :

.flex-direction-nav a {
font-family:icomoon !important;
}
.flex-direction-nav a {
font-family:icomoon !important;
}

Solution

  • Hello I've been through this before.. i solved by removing the '*' from the style like

    *{ 
      font-family: 'Montserrat', sans-serif !important;
    }
    

    Do it like this instead

    body,html {
       font-family: 'Montserrat', sans-serif !important;
    }
    

    NB: if you do it the first way you're practically saying all the all in tags,classes and id should take the Montserrat font which is not applicable to fontAwesome icon or any other icon