Search code examples
cssinternet-explorermagentofirefoxfont-face

Magento multi store - Font-face not working in firefox and ie

I have Magento Multi store. I have loaded the font family using Font-face kit. The Font face family is not working in firefox and IE.

Code:

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

Main Store URL : firststore.com
Secondary store URL : secondstore.com.

This font-face works fine in my main store in all browser. But in Secondary store font is not loaded correctly in Firefox and IE I'm using same theme for both store.

Help to fix this issue.

Solution

  • On your secondary domain, your stylesheets are loaded from the first domain, so the fonts get blocked on IE and Firefox due to cross-domain policies. Add this in your htaccess to allow your secondary website to use the fonts from the first one :

    <FilesMatch "\.(ttf|otf|eot|woff)$">
    <IfModule mod_headers.c>
        Header set Access-Control-Allow-Origin "http://example.com"
    </IfModule>
</FilesMatch>