• Resolved zena1939

    (@zena1939)


    It seems that the @fontface rule does not work on firefox. It works from internet explorer and chrome though.
    I tried adding the following code to the .htaccess file
    <FilesMatch “\.(ttf|otf|eot)$”>
    <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin “*”
    </IfModule>
    </FilesMatch>

    AddType font/ttf .ttf
    AddType font/eot .eot
    AddType font/otf .otf
    AddType font/woff .woff

    But it does not seem to be working.
    Any suggestions?

    Thanks in advance

Viewing 6 replies - 1 through 6 (of 6 total)
  • You seem to have forgotten to include ‘woff’ file type in the ‘FilesMatch’.

    Thread Starter zena1939

    (@zena1939)

    I added ‘woff’ file type in the Files Match but it doesn’t seem to be working. Thanks though.
    Any other suggestions?

    In Firefox, please look for any errors in the “Error Console” (under Toos => ‘Web Developer’). That may offer a clue on what’s going for a particular site or page.

    Thread Starter zena1939

    (@zena1939)

    Thank you so much! I figured it out. I used the Error Console tool and it gave me an error downloadable font failed. I clicked on the error and apparently I called the @fontface rule on the parent theme. Thus when I deleted it and called it on the child theme everything worked perfectly.
    Thank you. Also can you tell me more about anymore debugging tools out there.

    Glad to be of some help. All browsers have their own debugging tools. Almost every software and tool, including WordPress, comes with debugging too. The help section on the browsers (softwares, etc) is the best place to figure out what tool they use for debugging. I hope this help too. 🙂

    Here is an excellent article on how to use debugging tools in other browsers…

    Using Your Browser to Diagnose JavaScript Errors

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘@fontface rule for firefox’ is closed to new replies.