Search code examples
ruby-on-rails-3font-face

@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

Solution

  • 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 :)