Skip navigation
jameswood69
jameswood69
Currently Being Moderated

@fontface works offline, but not online.

Mar 10, 2013 6:19 AM

Tags: #fonts #font #not #offline #working #dreamweaver #online #fontface #polegysm

Hey everyone!

 

http://grafisk.kts.dk/elever/piwe2/opgave/kbh/index.php

 

The text "Kort om Turen går til København" is wrapped in a h2 tag. It's styles with a font called "Polegysm" via fontface.

 

For some reason when it's online it wont show.

 

I've tried with several browsers, but it doesn't seem to work when the website it uploaded.

 

Peace.

570 Views   17 Replies   Latest reply: jameswood69, Mar 10, 2013 11:34 AM
 
Replies
  • MurraySummers
    Currently Being Moderated
    1. MurraySummers,
    Mar 10, 2013 7:26 AM   in reply to jameswood69
    Report

    The file "polegysm.woff" is not found on the server. Did you upload it?

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,729 posts
    Oct 15, 2010
    Currently Being Moderated
    2. Sudarshan Thiagarajan,
    Mar 10, 2013 10:33 AM   in reply to jameswood69
    Report

    To add to Murray's response of checking the font file (it is not uploaded or the path to it in your CSS is incorrect), you may want to use fallbacks for your custom webfont. Here's a compatibility sheet for .woff fonts: http://caniuse.com/woff

     

    You may want to also include .eot and .ttf or .svg files for supporting other browsers.

     
    |
    Mark as:
  • jameswood69
    Currently Being Moderated
    3. jameswood69,
    Mar 10, 2013 10:38 AM   in reply to MurraySummers
    Report

    Hey Murray!

     

    Yes, I doublechecked! It is uploaded, but still it's using Arial.

     

    I will try Sudarshan's method of incl. .eot, ttf and svg's.

     

    Thanks.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,729 posts
    Oct 15, 2010
    Currently Being Moderated
    4. Sudarshan Thiagarajan,
    Mar 10, 2013 10:39 AM   in reply to jameswood69
    Report

    My method is only for 'compatibility with other browsers'. It should still work if you only have .woff. But in your case the file is not present where your code says it is.

     

    If it is uploaded, where is it uploaded to?

     
    |
    Mark as:
  • jameswood69
    Currently Being Moderated
    5. jameswood69,
    Mar 10, 2013 10:45 AM   in reply to Sudarshan Thiagarajan
    Report

    Hey Sudarshan

     

    Thank you for your response.

     

    This is how the folders are set up:

     

    folders.jpg

    The font is obviously in the font folder while the fontface selector is in a css file in the css folder.

     

    I wrote it like this:

     

    @font-face {

              font-family: 'Polegysm';

              src: url(../font/polegysm.woff);

              font-weight: normal;

              font-style:normal;

    }

     

    It works fine online, so the path must be written correctly. So for some weird reason it says it can't find like you guys said:/

     

    Peace.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,729 posts
    Oct 15, 2010
    Currently Being Moderated
    6. Sudarshan Thiagarajan,
    Mar 10, 2013 10:49 AM   in reply to jameswood69
    Report

    Prefix 'assets' is missing in the font-face definition in your CSS file. It should be ../assets/font/...

     

    This folder exists. But the full file link doesn't show up. And I cant see your directory listing as it is disabled on your server.

     

    You may want to open this on a FTP program like FileZilla or even within Dreamweaver once to check the filename is correct (make sure the case is correct. Some servers give an error as they're case sensitive.)

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,729 posts
    Oct 15, 2010
    Currently Being Moderated
    7. Sudarshan Thiagarajan,
    Mar 10, 2013 10:53 AM   in reply to Sudarshan Thiagarajan
    Report

    It is this folder: http://grafisk.kts.dk/elever/piwe2/opgave/assets/font/ - Check this folder on your remote server to see if the font exists and if the filename matches with that of your css definition.

     

    Regarding the /assets, sorry, my bad. I just realized that you're calling the font-file from within your CSS file - so, your filepath is correct. My apologies.

     
    |
    Mark as:
  • jameswood69
    Currently Being Moderated
    8. jameswood69,
    Mar 10, 2013 11:01 AM   in reply to Sudarshan Thiagarajan
    Report

    Hey Sudarshan!

     

    The "../assets/font/..." made me really scratch my head.

     

    Anyway I checked the "font" folder on the remote server and the font is no doubt there and I checked if the filename is the same of the css definition.

     

    It looks like it doesnt have access to the font folder or something.

     

    http://grafisk.kts.dk/elever/piwe2/opgave/assets/font/polegysm.woff

     

    We can't even download the font.

     

    Since I'm working on the school server I can't change the file permission to 755 (gives me in Filezilla 500 'SITE CHMOD 755 font': command not understood).

    I will look into tomorrow with the help of the teachers, I'll report back so we can find a definite answer!

     

    Peace.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,729 posts
    Oct 15, 2010
    Currently Being Moderated
    9. Sudarshan Thiagarajan,
    Mar 10, 2013 11:10 AM   in reply to jameswood69
    Report

    Can you post a screenshot of the folder listing of assets/font on your remote server?

     
    |
    Mark as:
  • jameswood69
    Currently Being Moderated
    10. jameswood69,
    Mar 10, 2013 11:13 AM   in reply to Sudarshan Thiagarajan
    Report

    No problem!

     

    Untitled-1.jpg

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,729 posts
    Oct 15, 2010
    Currently Being Moderated
    11. Sudarshan Thiagarajan,
    Mar 10, 2013 11:15 AM   in reply to jameswood69
    Report

    Right click the 'polegysm.woff' file, 'File Permissions' or 'Change Permissions' to '644'. See if that works.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,729 posts
    Oct 15, 2010
    Currently Being Moderated
    12. Sudarshan Thiagarajan,
    Mar 10, 2013 11:17 AM   in reply to Sudarshan Thiagarajan
    Report

    Also, CHMOD is a Unix command and will not work on Windows servers. The server hosting your file is a Windows server, not Unix. But you should be able to right-click and change it.

     
    |
    Mark as:
  • jameswood69
    Currently Being Moderated
    13. jameswood69,
    Mar 10, 2013 11:18 AM   in reply to Sudarshan Thiagarajan
    Report

    Hey

     

    I changed the file persmission to 644, but Filezilla gives me this:

     

    Command:SITE CHMOD 644 polegysm.woff
    Response:500 'SITE CHMOD 644 polegysm.woff': command not understood
     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,729 posts
    Oct 15, 2010
    Currently Being Moderated
    14. Sudarshan Thiagarajan,
    Mar 10, 2013 11:19 AM   in reply to jameswood69
    Report

    File > Site Manager > (Select your site) > Advanced > Server Type - ensure this is set to 'Autodetect'.

     
    |
    Mark as:
  • jameswood69
    Currently Being Moderated
    15. jameswood69,
    Mar 10, 2013 11:22 AM   in reply to Sudarshan Thiagarajan
    Report

    Yes it's on Autodetect.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,729 posts
    Oct 15, 2010
    Currently Being Moderated
    16. Sudarshan Thiagarajan,
    Mar 10, 2013 11:25 AM   in reply to jameswood69
    Report

    Your server is not supporting it.

     

    • Try deleting the 'font' folder in entirety and re-upload it afresh
    • If that still doesn't work, do you have a web control panel for your server? If you do, you could try changing the file permissions there
    • Still no luck - try putting the font file within your CSS folder itself and re-write the path in your .css file to see if that works
     
    |
    Mark as:
  • jameswood69
    Currently Being Moderated
    17. jameswood69,
    Mar 10, 2013 11:34 AM   in reply to Sudarshan Thiagarajan
    Report

    Doesn't seem to work :/

     

    I don't have access to the web control panel, but I will ask for that tomorrow.

     

    I also moved the font file to the css and changed the path, but that didn't work either. This website is not really for a client, but for a exam project that's due to on Wednesday. We'll be presenting the website locally, so it's not a big deal. Even though I'm curious why it's not displaying the font.

     

    I will add other font filetypes to see if that makes a difference. I will report back.

     

    Peace.

     
    |
    Mark as:
Actions

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points