WordPress.org

Ready to get started?Download WordPress

Forums

Quark
[resolved] Font Awesome not displaying (10 posts)

  1. french_toast
    Member
    Posted 9 months ago #

    Hello

    Font awesome is not loading for me
    http://sundistortion.com/

    I've hidden it for the time being.

    Web Fonts are where they should be: themes/quark/fonts & this is in the htaccess:

    <FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css)$">
      <IfModule mod_headers.c>
        Header set Access-Control-Allow-Origin "*"
      </IfModule>
    </FilesMatch>

    I'm running a few different websites from a single server which could be causing the issue. (Fonts were displaying fine when I was working locally on the theme)
    I'm new with using WordPress so apologies for my ignorance. Beautiful theme btw.

    Thank you for your time

  2. ahortin
    Member
    Theme Author

    Posted 9 months ago #

    Looking at the source of your web page, it looks like the font-awesome.min.css stylesheet is actually getting loaded ok. Could you please supply a URL of your site where you're trying to actually display the icon fonts, as I couldn't find a page that's using them.

    Also, try changing the above lines to the following

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

    This will only resolve issues with fonts that aren't displaying due to using a CDN, which causes problems for FF and IE as they have a 'cross-domain' issue.

  3. french_toast
    Member
    Posted 9 months ago #

    Hi Anthony

    http://sundistortion.com/

    The Parent Menu item is now showing a font-awesome character, which is just rendering as a box

    Thanks

  4. ahortin
    Member
    Theme Author

    Posted 9 months ago #

    Can you confirm if you/your host is actually using a CDN?
    Did you change the lines in the .htaccess files as I mentioned?
    Also make sure you clear your CDN's cache.

  5. french_toast
    Member
    Posted 9 months ago #

    Did some research & my host isn't using a CDN.
    I tried replacing the .htaccess files as mentioned with no change.

    Any more ideas?

  6. ahortin
    Member
    Theme Author

    Posted 9 months ago #

    Can you please make sure that the fontawesome-webfont.woff file is in the themes/quark/fonts folder as it doesn't appear to be loading. The browser is returning a 404 error on that file. I'd suggest copying up the whole fonts folder to your server again.

  7. french_toast
    Member
    Posted 9 months ago #

    Yes, all fonts are in the correct folder.

    Did some more research & it seems it's a hosting issue with GoDaddy.
    http://stackoverflow.com/questions/7209759/problems-using-font-face-for-site-hosted-on-godaddy

    http://css-tricks.com/forums/topic/please-help-fontface-not-working-with-godaddy/

    I've tried moving the font files into the css folder & changing the corresponding file paths to no avail. I've also double checked folder permissions are OK.

    At wits end with this.
    Moral of the story, don't use GoDaddy.

  8. ahortin
    Member
    Theme Author

    Posted 8 months ago #

    Something else for you to try...

    Try changing the font path for all the font files in css/font-awesome-min.css to a fully qualified path.

    ie. change
    ../fonts/fontawesome-webfont.eot?v=3.2.1
    to
    http://sundistortion.com/wp-content/themes/quark/fonts/fontawesome-webfont.eot?v=3.2.1

    Do this for each of the font files that it references (.eot/.woff/.ttf/.svg)

  9. french_toast
    Member
    Posted 8 months ago #

    Tried changing the file path as requested but it didn't work.

    I did try clipping the "?v=3.2.1" from the file paths & the icons are up & running (although not in Firefox)

    How will clipping the version number effect the fonts?

    Thanks for your time & persistence.

  10. ahortin
    Member
    Theme Author

    Posted 8 months ago #

    To find out more about using font-face, I'd suggest reading through this article by Paul Irish - http://www.paulirish.com/2009/bulletproof-font-face-implementation-syntax/

    Basically, the parameters on the URL string are for cross browser compatability. I wouldn't recommend removing them.

    If you've tried all the recommended solutions in those articles that talk about GoDaddy issues, as well as all the suggestions that I've mentioned above, and you're still having issues, then the only other thing I can suggest is that you move webhosts.

Reply

You must log in to post.

About this Theme

About this Topic