CODEWITHSUNDEEP
phpwordpress.htaccessgoogle-chromefirefox
Irfan
Irfan

Reputation: 5062

Custom fonts not rendering on Firefox

Why my custom embedded fonts are not rendering on Firefox & IE. It does render on Chrome and on my local machine. I've properly embedded them

Please check below link with FF & Chrome and you will see the difference: http://www.superiorbondcleaning.com.au/devsite/

I'm working on development site and I know there is redirect issue, all the links are redirecting to parent site. Can this be this reason?

Here is the .httacess rules which I can see in WordPress permalinks editor:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /devsite/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /devsite/index.php [L]
</IfModule>

Can anyone help me why is not working in FF & IE but it is working in Chrome? Thanks.

Upvotes: 0

Views: 116

Answers (1)

Bud Damyanov
Bud Damyanov

Reputation: 31839

The problem is the following error, when you open the Firefox error console:

downloadable font: download failed (font-family: "FuturaStd-CondensedLight" style:normal weight:normal stretch:normal src index:2): bad URI or cross-site access not allowed source: http://superiorbondcleaning.com.au/devsite/wp-content/themes/canvas-scb/includes/fonts/FuturaStd-CondensedLight.ttf.

In order to use the custom fonts, provide the absolute URL to them, not relative ones, as you do now.

Replace the URL in following lines with absolute ones (also for other fonts), then clear your browser cache and test again:

@font-face {
    font-family: 'FuturaStd-CondensedBold';
    src: url('includes/fonts/FuturaStd-CondensedBold.eot');
    src: url('includes/fonts/FuturaStd-CondensedBold.eot?#iefix') format('embedded-opentype'), url('includes/fonts/FuturaStd-CondensedBold.woff') format('woff'), url('includes/fonts/FuturaStd-CondensedBold.ttf') format('truetype'), url('includes/fonts/FuturaStd-CondensedBold.svg') format('svg');
    font-weight: normal;
    font-style: normal;

Upvotes: 1

Related Questions