In my global.css file which is loaded by application.html.erb, I have the following lines:
@font-face {
font-family: myfont;
src: url(/lib/fonts/MyFont-AH.ttf) format("truetype"); /* For IE */
src: local("MyFont-AH"), url(/lib/fonts/MyFont-AH.ttf) format("truetype"); /* Non-IE */
}
And then elsewhere I have
h1 {
font-family: myfont, helvetica, arial;
}
When I booted up the server h1 was using the Helvetica font, and I got the error in my log ActionController::RoutingError (No route matches [GET] "/lib/fonts/MyFont-AH.ttf"):. I figured that this meant I would need to edit my routes file, so I went and added the line get "/lib/fonts/MyFont-AH.ttf", but then when I reloaded the page I got the error missing :controller because there is no controller tied to this action. When I created a controller and matched the get request to it, it then wanted a template. It seems that it wants me to have a controller / action set up like most other get requests, so I'm not quite sure what to do here. Any suggestions?
I upgraded to Rails 3.2 and am using the Asset Pipeline (from Rails 3.1+), and I placed the fonts I wanted to display in vendor/assets/fonts. Then I added the following line to my application.rb file: config.assets.paths << "#{Rails.root}/vendor/assets/fonts". Finally in my CSS file I used the format:
@font-face {
font-family: myfont;
src: url("/assets/myfont.ttf") format("truetype"); /* For IE */
src: local("myfont"), url("/assets/myfont.ttf") format("truetype"); /* For non-IE */
}
I think a part of the original problem might have been that my files were stored with the extension .TTF rather than .ttf but I'm not sure. All I know is it's working now.