Heroku not loading Google fonts

Question

I'm running a site on Heroku, and having some troubles getting a google font to load.

My typography.sass file contains this:

@import url(http://fonts.googleapis.com/css?family=Bitter)

h1
  font-family: 'Bitter', Helvetica, serif

My production.rb file contains the lines:

config.serve_static_assets = true
config.assets.compile = true
config.assets.digest = true

My Gemfile includes:

gem 'rails_12factor', group: :production

I've gone through all the Heroku issues with the asset pipeline, and I've gotten all of my images and css files to load properly in production, but for whatever reason, the font only works in development.

Answer 1

I had the same problem and found this answer:

https://stackoverflow.com/a/18216759

It appears that Heroku wants https. So throwing in https solved the problem for me.

Answer 2

I used to have the same issue but deleting the assets folder located in the public folder solved the problem for me. This will let Heroku precompile the css files for you and not use the files generate by running rake assets:precompile locally.

Answer 3

This fellow seemed to have a similar problem to yourself:

http://robert-reiz.com/2012/11/16/google-fonts-on-heroku/

Try his method of fixing it and see if that works. Good luck!