2012-03-10 4 views
1

Rails 3.1とAsset Pipelineにアップグレードしたばかりで、フォントフェースが読み込まれない理由を理解できません。私はこの記事の回答を(運がないと)試しました: Using @font-face with Rails 3.1 app?フォントフェイスがRails 3.1で動作していない

現在、私は選択したソリューションを試しています。私はapp/assetsの下にフォントフォルダを持っています。ファイル名は正しく、フォントディレクトリに存在します。私Application.rbで

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

私はまた、ガイドレール(http://guides.rubyonrails.org/asset_pipeline.html)から、試してみた:コードがある場合は、このコードで

config.assets.paths << Rails.root.join("app", "assets", "fonts") 

は、パスはこれにマッピングします私のCSSで src: url('/assets/League_Gothic-webfont.eot

を実行します。

@font-face { 
    font-family: "League_Gothic"; 
    src: url('<%= asset_path('League_Gothic-webfont.eot') %>'); 
    font-weight: normal; 
    font-style: normal; 
} 

私は他のソリューションを試し、基本的にハードパスをコーディング:

src: url(/assets/fonts/League_Gothic-webfont.eot); 

私は、ページのソースコード内のリンクをクリックしたときに、私はこのエラーを取得:

No route matches [GET] "/assets/fonts/League_Gothic-webfont.eot" 

答えて

2

あなたはapplication.rbでこれらの変更を行う必要はありません。

しかし、 "assets/myfont.eof"を実行する必要があるときに、 "assets/fonts/ myfont.eof"を実行している可能性があります。アセットであれば、フォント、イメージなどのディレクトリ名は扱わないでください。アセットから呼び出すだけです。/

これを行うには、application.rbで変更したものを取り除かなければならないかもしれません。私は夢中になって、それを試してみてください。


また、プロジェクトに私のCSSファイルから私が働いている:これは役立つかもしれない

@font-face 
{ 
    font-family: ubuntu; 
    src: url("/assets/Ubuntu-R.ttf"); 
} 

+0

を使用する前に、あなたが正しいなら、CSSやSCSSにこれを追加しますが、

# Enable the asset pipeline config.assets.enabled = true config.assets.paths << "#{Rails.root}/vendor/assets/fonts" # Precompile additional assets config.assets.precompile += %w(.svg .eot .woff .ttf) 

をapplication.rbするためにこれを追加します。私のRails 3.2プロジェクトでは、src:url( "league_gothic-webfont.eot");アセットのパスがvendor/assets/fonts/league_gothic-webfont.eotであっても、「アセット」や「アセット/フォント」がなくても機能しました。 – idrinkpabst

+0

@idrinkpabstこれはRails 3.1のためだと思います。あなたが指摘したように、Railsの3.2プロジェクト – varatis

3

するとない正確フォントが

@font-face { 
    font-family: 'Museo300Regular'; 
    src: font-url('Museo300-Regular-webfont.eot'); 
    src: local('Museo300Regular'), 
     font-url('Museo300-Regular-webfont.eot?#iefix') format("embedded-opentype"), 
     font-url('Museo300-Regular-webfont.woff') format("woff"), 
     font-url('Museo300-Regular-webfont.ttf') format("truetype"), 
     font-url('Museo300-Regular-webfont.svg#Museo300Regular') format("svg") ; 
    font-weight: normal; 
    font-style: normal; 
} 
+0

魅力的なように働いた!ありがとう。 –

関連する問題