setting up fonts in rails 4

font-face.md

It's Easy!

1. Put this in your application.rb

    config.assets.paths << Rails.root.join('app', 'assets', 'fonts')
    config.assets.precompile += %w( .svg .eot .woff .ttf )
   

2. Reboot your server!

3. Create a fonts.scss file in assets/stylesheets.

4. Set up your font-face thusly. Pay extra attention to punctuation - everything must appear exactly as it does in the file system.

    @font-face {
    	font-family:'Damion-Regular';
    	src: asset-url('damion/Damion-Regular.eot');
    	src: asset-url('damion/Damion-Regular.eot?#iefix') format('embedded-opentype'),
    		asset-url('damion/Damion-Regular.woff') format('woff'),
    		asset-url('damion/Damion-Regular.ttf') format('truetype'),
    		asset-url('damion/Damion-Regular.svg#Damion-Regular') format('svg');
    	font-weight: normal;
    	font-style: normal;
    }
   

5. Include your fonts file in application.css.sass by adding @import fonts.

Voila! Have a nice font. Happy typography.

*nb: we set it up so that we have the following file structure:

appname
	app
		assets
			fonts
				damion
					Damion-Regular.eot
					Damion-Regular.woff
					Damion-Regular.ttf
					Damion-Regular.svg
				someotherfont
					Someotherfont-Regular.eot
					Someotherfont-Regular.woff
					Someotherfont-Regular.ttf
					Someotherfont-Regular.svg