Note that there are some explanatory texts on larger screens.

plurals
  1. POStoring webfonts in a gem using the Rails 3.1 Asset Pipeline
    text
    copied!<p>I'm trying to use the Rails 3.1 Asset Pipeline to store some fonts that I'm using across multiple applications. I've tried just about every combination of storage location but I can't seem to get the pipeline to actually pick up my font files. They will show up in <code>public/assets</code> when I run <code>rake assets:precompile</code> but they aren't available from any <code>asset_path</code> helpers and I haven't been able to figure out why.</p> <p>Example from <code>fonts.css.erb</code>:</p> <pre><code>@font-face { font-family: 'MuseoSans'; src: url('&lt;%= asset_path('museosans_500_italic_webfont.eot') %&gt;'); src: url('&lt;%= asset_path('museosans_500_italic_webfont.eot?#iefix') %&gt;') format('eot'), url('&lt;%= asset_path('museosans_500_italic_webfont.woff') %&gt;') format('woff'), url('&lt;%= asset_path('museosans_500_italic_webfont.ttf') %&gt;') format('truetype'), url('&lt;%= asset_path('museosans_500_italic_webfont.svg#webfontcWw5DXpH') %&gt;') format('svg'); font-weight: normal; font-style: italic; } </code></pre> <p>Output of <code>ls app/assets/images</code> (stuck it in <code>images</code> since <code>assets/fonts</code> wasn't working, but had the same lack of working both times):</p> <pre><code>museosans_100_italic_webfont.eot museosans_500_webfont.eot museosans_100_italic_webfont.svg museosans_500_webfont.svg museosans_100_italic_webfont.ttf museosans_500_webfont.ttf museosans_100_italic_webfont.woff museosans_500_webfont.woff museosans_100_webfont.eot museosans_700_italic_webfont.eot museosans_100_webfont.svg museosans_700_italic_webfont.svg museosans_100_webfont.ttf museosans_700_italic_webfont.ttf museosans_100_webfont.woff museosans_700_italic_webfont.woff museosans_300_italic_webfont.eot museosans_700_webfont.eot museosans_300_italic_webfont.svg museosans_700_webfont.svg museosans_300_italic_webfont.ttf museosans_700_webfont.ttf museosans_300_italic_webfont.woff museosans_700_webfont.woff museosans_300_webfont.eot museosans_900_italic_webfont.eot museosans_300_webfont.svg museosans_900_italic_webfont.svg museosans_300_webfont.ttf museosans_900_italic_webfont.ttf museosans_300_webfont.woff museosans_900_italic_webfont.woff museosans_500_italic_webfont.eot museosans_900_webfont.eot museosans_500_italic_webfont.svg museosans_900_webfont.svg museosans_500_italic_webfont.ttf museosans_900_webfont.ttf museosans_500_italic_webfont.woff museosans_900_webfont.woff </code></pre> <p>I've tried accessing from:</p> <ul> <li><code>/assets/museosans_500_italic_webfont.svg</code></li> <li><code>/assets/images/museosans_500_italic_webfont.svg</code></li> <li><code>/images/museosans_500_italic_webfont.svg</code></li> </ul> <p>It's not picking it up anywhere. Any thoughts?</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload