Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

@font-face rails 3.2

I was thinking of trying to use font-squirrels fonts in my rails app using @font-face. Hope this is the correct way of explaining it. I'm relatively new to this so was hoping someone could advise on how I would get this to work within the rails app

Thanks

like image 635
Richlewis Avatar asked Sep 03 '12 19:09

Richlewis


1 Answers

OK so thought I would give the answer so it may help other people out in my situation. I just googled it and put all the pieces together, I was being lazy/afraid of the unknown on this one so apologies for that.Just trying it really helps understanding

Anyway

1) Create a folder called fonts in app/assets
2)Put all svg .eot .woff .ttf within this folder
3)In config/application.rb put the following

# Add the fonts path
config.assets.paths << "#{Rails.root}/app/assets/fonts"

# Precompile additional assets
config.assets.precompile += %w( .svg .eot .woff .ttf ) 

4)In your application stylesheets you place your @font-face styles, for example

  @font-face {
font-family: 'DearestRegular';
src: url('Dearest-webfont.eot');
src: url('Dearest-webfont.eot?#iefix') format('embedded-opentype'),
     url('Dearest-webfont.woff') format('woff'),
     url('Dearest-webfont.ttf') format('truetype'),
     url('Dearest-webfont.svg#DearestRegular') format('svg');
font-weight: normal;
font-style: normal;

}

5) Then wherever you want to use the font just use font-family as normal 6) Oh and restart the server to bring it all together :)

like image 164
Richlewis Avatar answered Jan 04 '23 06:01

Richlewis