WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] @fontface rule for firefox (7 posts)

  1. zena1939
    Member
    Posted 1 year ago #

    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

  2. Pothi
    Member
    Posted 1 year ago #

    You seem to have forgotten to include 'woff' file type in the 'FilesMatch'.

  3. zena1939
    Member
    Posted 1 year ago #

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

  4. Pothi
    Member
    Posted 1 year ago #

    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.

  5. zena1939
    Member
    Posted 1 year ago #

    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.

  6. Pothi
    Member
    Posted 1 year ago #

    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. :)

  7. Pothi
    Member
    Posted 1 year ago #

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

    Using Your Browser to Diagnose JavaScript Errors

Topic Closed

This topic has been closed to new replies.

About this Topic