0

So not sure what the problem is really have tried a few ways but I can't get font-files to work.

I have placed my font files in

 root/craft/templates/assets/fonts/bootstrap

Here is an example of @font-face that I am using...

@font-face {
    font-family: "Glyphicons Halflings";
    src: 
    url("{{ siteUrl }}/assets/fonts/bootstrap/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"), 
    url("{{ siteUrl }}/assets/fonts/bootstrap/glyphicons-halflings-regular.woff2") format("woff2"), 
    url("{{ siteUrl }}/assets/fonts/bootstrap/glyphicons-halflings-regular.woff") format("woff"), 
    url("{{ siteUrl }}/assets/fonts/bootstrap/glyphicons-halflings-regular.ttf") format("truetype"), 
    url("{{ siteUrl }}/assets/fonts/bootstrap/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg");
}

In firebug I get "NetworkError: 500 Internal Server Error - http://example.com/assets/fonts/bootstrap/glyphicons-halflings-regular.woff"

If I try to access the file directly I get the following message with craft styling etc so this is a craft error not a typical 500 error.

Internal Server Error

Unexpected character ""

Now if I try to access a css file it works fine, but my font files are returning 500 errors.

I have placed my css files in

 root/craft/templates/assets/css

1 Answer 1

3

Your css and your fonts should be in the public section of the craft website. So put your css in "root/public/assets/css" and "root/public/assets/fonts/bootstrap". Than remove the {{ siteurl }} twig code (in this therme only use plain css).

4
  • I don't understand why you suggest putting css and js in public folder... This doesn't solve the problem. I was able to fix my font issue by using this as a path in my css file {{ siteUrl }}craft/templates/assets/fonts/bootstrap/ and it works so why put everything in a public folder?
    – Bowenac
    Commented May 5, 2015 at 19:12
  • Moving all css and js to a public folder I then use ../fonts/bootstrap/ but it still works the same. Just moving it to the public folder wasn't the reason the fonts were not working, and really css and js should be able to be in any folder you want as long as your path is correct.
    – Bowenac
    Commented May 5, 2015 at 19:23
  • "css and js should be able to be in any folder " – The folder must be above web root. Best practice is to have craft/ below that and a folder public/ (or named like you want) with Craft's index.php and .htaccess above. @Bowenac
    – carlcs
    Commented May 5, 2015 at 20:08
  • It's also not a very good idea to use Twig in your CSS (see Brandon's post)! Better use relative or root relative paths for your fonts as explained in this answer.
    – carlcs
    Commented May 5, 2015 at 20:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.