How to show Cross-Domain Fonts in Mozilla FireFox

Posted on June 10, 2014 @ 12:00 am

Tags: , ,

4 Comments

Last updated on December 26th, 2015 at 10:31 pm

Working with my clients doesn't leave me any free time to update and check my own website FixMyWP.com for any issues. Since I work mostly with Chrome and only use FF, Opera and IE for debugging my client websites I rarely find myself browsing Fix My WP with any of them. Today it was the first time that I use FireFox for browsing to my homepage after enabling cdn services from MaxCDN, a CDN service that improved my website loading time a LOT! Apparently this change affected my website fonts when viewed with FireFox where they didn't show: show Cross-Domain Fonts in FireFox With MaxCDN all my static content is actually being served from their server facilities, using an external domain like fixmywp-makistv.netdna-ssl.com instead of my native domain fixmywp.com. Well as it seems FireFox doesn't allow loading cross domain fonts by default, that means I(we) need to apply a fix to bypass this setting:

  1. Open your .htaccess file, its located on the root of your website(you can browse there either using your hosting panel file manager or using a ftp client like Filezilla).
  2. Move the cursor to the top of the file contents, press enter to create a new blank like.
  3. Insert the following snippet:
    #allow FF to use cross-domain fonts#
    <FilesMatch ".(ttf|otf|eot|woff)$">
      <IfModule mod_headers.c>
        Header set Access-Control-Allow-Origin "*"
      </IfModule>
    </FilesMatch>
  4. Save and refresh your website!

Makis Mourelatos

WordPress Security Engineer at FixMyWP
WC Athens 2016 co-organizer, WP Support and Security Aficionado, Wannabe Kitesurfer.

Comments (4)

  1. Damian Reply

    January 7, 2015 at 8:40 pm

    Is not working for me In chrome I get the same error 🙁

  2. Fix My WP Reply

    January 7, 2015 at 8:57 pm

    Hello Damian!
    Are you using MaxCDN?

  3. Dimitar Ivanov Reply

    January 24, 2016 at 8:28 am

    Your code will work only on Apache servers. To enable cross-domain fonts on Nginx and IIS see: http://zinoui.com/blog/cross-domain-fonts

    1. Fix My WP Reply

      January 24, 2016 at 2:23 pm

      Thanks Dimitar for the comment.
      I’m working with Apache so my tutorials are Apache driven.

Leave a Reply

Your email address will not be published. Required fields are marked *