Как загружать и использовать значки шрифтов?

Question

Я использую Rails 4.0.2 с ruby 2.0.0p247 (2013-06-27 revision 41674) [x86_64-linux] и стандартным (встроенным) сервером rails и нуждаюсь в некоторой помощи для загрузки и использования следующих шрифтовых значков в моем приложении - http://fontello.com/.

Я загрузил файлы шрифтов и разместил их в папке /vendor/assets/fonts/. Затем в /vendor/assets/stylesheets/shared/fonts.css файл я добавил код ниже:

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

Кажется, все становится загружен правильно, потому что нет никаких ошибок в консоли браузера.

Затем, используя HTML ниже я пытаюсь получить некоторые иконки:

<div> 
    <span data-icon="0xe800">test</span> 
    <span data-icon="icon-emo-happy">test</span> 
    <a href="##url##">0xe809</a> 
</div> 

но теперь иконки Arae показали - только текст (я не уверен, что это правильный путь, чтобы загрузить их).

В документации сказано, что:

Обычно apache уже имеет необходимые настройки, но nginx и другие веб-серверы должны быть настроены. Вот список типов MIME для наших расширений файлов:

• application/vnd.ms-fontobject - СРВ
• application/x-font-woff - Уофф
• application/x-font-ttf - TTF
• image/svg+xml - SVG

Таким образом, в /config/initializers/mime_types.rb файл Я попробовал:

Mime::Type.register_alias "application/vnd.ms-fontobject", :eot 
Mime::Type.register_alias "application/x-font-woff", :woff 
Mime::Type.register_alias "application/x-font-tt", :ttf 
Mime::Type.register_alias "application/image/svg+xml", :svg 

и это:

Rack::Mime::MIME_TYPES['.eot'] = 'application/vnd.ms-fontobject' 
Rack::Mime::MIME_TYPES['.woff'] = 'application/x-font-woff' 
Rack::Mime::MIME_TYPES['.ttf'] = 'application/x-font-ttf' 
Rack::Mime::MIME_TYPES['.svg'] = 'image/svg+xml' 

с перезагрузки сервера, но ничего не изменилось.

У кого-нибудь есть опыт в этом и может помочь мне?

Answer 1

Проблема была вызвана неправильной загрузкой файлов шрифтов. Если вы используете css файл, чтобы объявить класс шрифта, необходимо выполнить следующие действия:

1. В файле aplication.rb добавьте следующую строку:

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

   В приведенном выше случае, шрифт файлы находятся в папке app/vendor/assets/fonts.

2. При декларировании использовать класс Font assets + font name ссылки в URL, как это:

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

3. В моем случае мне нужно было дополнительно require удерживающего объявление класса шрифта css файла. В моем application.css файл, я добавил строку ниже:

   * = требуют общего/fonts.css

   Примечание: В моем случае файл font.css в /vendor/assets/stylesheets/shared/ папке.