FontAwesome not loading / showing weired signs from global.css

DRMasterChief · March 31, 2020

Hello, i have a strange thing with FontAwesome - this is not loading since we have moved to an other faster hosting plan. It only shows weired signs in the Frontoffice, e.g. at button cart, contact and so on. Pls. refer to the picture.

The 'old' hosting plan was with Apache and MySQL, the new is with nginx and MariaDB on SSD drives. Not sure if this can be a reason? The move was directly with copying all files and import DB via phpMyAdmin.

We are not using the standard theme, but when i change the frontend theme to default, the FontAwesome will NOT be loaded either.

I have checked path and files again and again and the files are stored correctly, i also have tried various permissions, without any effect. In global.css there is the following call:

src: url ("../ fonts / font-awesome / fontawesome-webfont.eot? v = 4.6.3");

src: url ("../ fonts / font-awesome / fontawesome-webfont.eot? # iefix & v = 4.6.3") format ("embedded-opentype"), url ("../ fonts / font-awesome / fontawesome -webfont.woff2? v = 4.6.3 ") format (" woff2 "), url (" ../ fonts / font-awesome / fontawesome-webfont.woff? v = 4.6.3 ") format (" woff ") , url ("../ fonts / font-awesome / fontawesome-webfont.ttf? v = 4.6.3") format ("truetype"), url ("../ fonts / font-awesome / fontawesome-webfont.svg ? v = 4.6.3 # fontawesomeregular ") format (" svg ");

and the direct path on server is: /public_html/shop/themes/community-theme-default/fonts/font-awesome

So this file is also offered for download when called up in the browser and is therefore found (the other file extensions too):

mydomain.xyz/themes/community-theme-default/fonts/font-awesome/fontawesome-webfont.eot
mydomain.xyz/themes/community-theme-default/fonts/font-awesome/fontawesome-webfont.woff2
etc.

We have deleted or emptied the .htaccess too, but with no success or other result. Do you have any idea or solution?! thank you

Edited March 31, 2020 by DRMasterChief

datakick · March 31, 2020

What does javascript error console says?

DRMasterChief · March 31, 2020

nothing, no error, no warning 😰

datakick · March 31, 2020

What content-type is returned for these font resources? Browser might not load fonts if the resourse is served with invalid or incorrect content type.

DRMasterChief · March 31, 2020

When i type in the direct path into the browser, then the files are been downloaded. Could there be something in the .htaccess which goes wrong (AddFile e.g.)?

datakick · March 31, 2020

3 minutes ago, DRMasterChief said:

When i type in the direct path into the browser, then the files are been downloaded. Could there be something in the .htaccess which goes wrong (AddFile e.g.)?

You wrote you are using nginx --> .htaccess is therefore irrelevant (unless you have apache behind nginx, which would be kinda weird)

You didn't respond to my question -- what content type is the font resource served with? Look into network tab

DRMasterChief · March 31, 2020

it seems to be font: (but preview is weired, not sure if this is normal for this type of file)

Edited March 31, 2020 by DRMasterChief

DRMasterChief · March 31, 2020

and here another site with 3 fonts:

datakick · March 31, 2020

I still don't see the what is inside Content-Type header 🙂

DRMasterChief · March 31, 2020

uff, this is all i get from my Chrome. The fonts should be loaded from local hosting source, not via online / webservice !

Edited March 31, 2020 by DRMasterChief

datakick · March 31, 2020

Content type should be font/woff2. You should adjust your nginx configuration accordingly.

DRMasterChief · March 31, 2020

and this is from startpage, there is no content-type showing !!

DRMasterChief · March 31, 2020

Server is Litespeed . I can set Apache Handle in CPanel control panel, is this correct or useful for this?

Edited March 31, 2020 by DRMasterChief

DRMasterChief · March 31, 2020

Hello,

now i have checked with 'old' hosting (there are no such problems there). The Chrome dev tools give the same content type and this tb site works fine. So now ?!?

toplakd · March 31, 2020

Can you also check MIME Types (should be next to Apache handlers in Cpanel)

DRMasterChief · April 1, 2020

Hello @toplakd , i have checked this in CPanel and it is correct (same as your picture).

Could this error caused by anything in DB and utf-8 (or wrong settings for utf-8 when DB was transfered)?

edit: now i have rechecked all DB tables, some of them are utf8_generel_ci , most are utf8mb4_unicode_ci . I have set all tables in the new hosting to the same as old hosting, but no success 😩

Edited April 1, 2020 by DRMasterChief

DRMasterChief · April 3, 2020

Hi, still no success here. I do a backup with MySQLDumper, which usually is flawless, then import this into the new hosting. Still the same. Also checked the collations and tried different.

Think i have to install tb from ground, then install Theme too. But i have a lot of customized files (Frontend and translations), how to find and copy them?

datakick · April 3, 2020

12 minutes ago, DRMasterChief said:

Hi, still no success here. I do a backup with MySQLDumper, which usually is flawless, then import this into the new hosting. Still the same. Also checked the collations and tried different.

Think i have to install tb from ground, then install Theme too. But i have a lot of customized files (Frontend and translations), how to find and copy them?

I don't think this has anything to do with tb, but it's misconfiguration of server. I really believe that if you fix content-type it will work correctly. Content type tells browser how to interpret file. If server send invalid, or unknow, type then browser just don't know what to do with the file.

Note: in your last screenshot you are displaying content type for woff file type, not for woff2

Note2: specification is very clear about mime type: https://www.w3.org/TR/WOFF2/#IMT

According to specification, woff2 mime type is font/woff2. Your server sends application/font-woff2

DRMasterChief · April 3, 2020

Hello @datakick thank you for your idea and reply, glad about this.

But... please see my posting from Tuesday at 10:38 PM and the picture. The 'old' hosting shows the same in Chrome and this works without these problems.

Please give me some minutes, at the moment i will do a fresh installation of tb in the same hosting in a separate folder and database, lets see how this is then. Maybe i have to contact the hoster then again, with informaiton about your link for mime type.

Edited April 3, 2020 by DRMasterChief

datakick · April 3, 2020

25 minutes ago, DRMasterChief said:

But... please see my posting from Tuesday at 10:38 PM and the picture. The 'old' hosting shows the same in Chrome and this works without these problems.

see my previous note -- your screenshots shows loading of *.woff, not *.woff2 -- these are different formats, with different content types

DRMasterChief · April 3, 2020

Have done a new picture, please have a look at this (from old / current hosting), woff would be 'enough' for the symbols, but there is also a woff2 which is loaded and seems to be correct on the old hosting.

On the 'new' hosting, the Open Sans font is not be loaded at all, wtf ?

toplakd · April 3, 2020

14 minutes ago, DRMasterChief said:

On the 'new' hosting, the Open Sans font is not be loaded at all, wtf ?

Because of this:

This is the main source of the problem. There are lot of infos on google regarding not loading fonts/js/css due to wrong mime types.

Edited April 3, 2020 by toplakd

DRMasterChief · April 3, 2020

Hello, i have contacted the support from hoster. They told me, that in .htaccess the data is already included:

...
AddType application/font-woff .woff
AddType application/font-woff2 .woff2
...

but no success, also not with the fresh clean install of tb.

toplakd · April 3, 2020

There is nothing wrong with tb.

Read datakick posts once again, about correct mime types.

Your server is sending wrong mime for fonts and they are therefore not displayed.

Edited April 3, 2020 by toplakd

DRMasterChief · April 3, 2020

Dont get me wrong, i also think that there is no problem with tb 🙂

The hoster will give me an account on an Apache server, i will install and test my migration then and hope the best!

toplakd · April 4, 2020

11 hours ago, DRMasterChief said:

Hello, i have contacted the support from hoster. They told me, that in .htaccess the data is already included:

...
AddType application/font-woff .woff
AddType application/font-woff2 .woff2
...

but no success, also not with the fresh clean install of tb.

It should say:

AddType font/woff .woff
AddType font/woff2 .woff2

https://github.com/fontello/fontello/wiki/How-to-setup-server-to-serve-fonts

However, i just tried and deleted my .htaccess on stock tb instalation and generated one through Preferences/Seo & URLs/Generate .htaccess file

Generated file does indeed have

AddType application/font-woff .woff
AddType application/font-woff2 .woff2

Edited April 4, 2020 by toplakd

Sign In

FontAwesome not loading / showing weired signs from global.css

Question

DRMasterChief

30 answers to this question

Recommended Posts

datakick

DRMasterChief

datakick

DRMasterChief

datakick

DRMasterChief

DRMasterChief

datakick

DRMasterChief

datakick

DRMasterChief

DRMasterChief

DRMasterChief

toplakd

DRMasterChief

DRMasterChief

datakick

DRMasterChief

datakick

DRMasterChief

toplakd

DRMasterChief

toplakd

DRMasterChief

toplakd

Create an account or sign in to comment

Create an account

Sign in