Как добавить favicon в рельсы 3.2 - PullRequest
Новая
       18

Как добавить favicon в рельсы 3.2

73 голосов
/ 28 марта 2012

Я знаю, что новые приложения rails поставляются с пустым файлом favicon.ico. Я хочу знать, как я добавляю иконку. Я знаю, что вы можете использовать помощник favicon_link_tag, но я не уверен, как заполнить файл favicon.ico. Вы используете генераторы favicon? Если так, какой из них лучше?

Я также хочу иметь возможность кэшировать его, делает ли rails это также автоматически?

Спасибо

Ответы [ 11 ]

112 голосов
/ 30 апреля 2013

Просто добавьте это в <head></head> раздел ваших макетов: 

<%= favicon_link_tag 'favicon.ico' %>

Поместите изображение favicon.ico в /app/assets/images/, если вы используете конвейер ресурсов, и в /public/images/, если вы не используете.

Кроме того, существует ошибка при использовании Ruby 2.0 с Rails 3.0.20 (и, возможно, также 3.0.x), которая выдает исключение при попытке визуализации favicon.ico.

Исправление - поместить следующий код в application_controller.rb: 

  config.relative_url_root = ""
69 голосов
/ 28 марта 2012

создайте свой значок, например, здесь: http://www.favicon.cc/ и поместите в public / directory

ОБНОВЛЕНИЕ Фавикон в общей папке не скомпилирован заранее, и он может быть кэширован длямного времени.Похоже, лучше использовать favicon_link_tag , чтобы избежать проблем с обновлением favicon.Я не знаю, браузерам нужен favicon в корне.Согласно favicon wiki все современные браузеры поддерживают 

<link rel="shortcut icon" href="favicon path" /> (favicon_link_tag)
9 голосов
/ 04 октября 2013

Хотя все эти ответы говорят о создании значка 16x16, реальность такова, что вы должны создавать как 16x16, так и 32x32, чтобы поддерживать дисплеи сетчатки. Ни один из онлайн-генераторов не справился с этим очень хорошо.

На Mac есть отличное приложение стоимостью $ 5 Icon Slate , которое позволяет вам легко создавать оба формата в одном файле ICO.

В Windows я с большим успехом использовал Axialis IconWorkshop , но это гораздо более тяжелый инструмент и значительно дороже примерно на 50 евро.

Оба создадут файл ico с изображениями размером 16x16 и 32x32.

Если вы используете конвейер ресурсов, используйте папку app / assets / images, а не / public. Число крайних браузеров, которые игнорируют тег link, быстро приближается к нулю, поэтому прыгать через обручи, чтобы приспособиться к ним, не стоит.

Как упоминалось в других ответах, используйте это в head, чтобы отобразить его: 

<%= favicon_link_tag 'favicon.ico' %>
5 голосов
/ 04 января 2013

Я настоятельно рекомендую эту опцию. Это было легко и бесплатно http://converticon.com

3 голосов
/ 21 января 2015

записать в application.html.haml : 

= favicon_link_tag '/images/favicon.ico'

файл места favicon.ico в каталоге: 

project/public/images
2 голосов
/ 05 августа 2012

Вам в значительной степени нужен файл изображения 16x16 пикселей с именем favicon.ico, и он должен быть доступен публично в корне вашего сайта.

Вы всегда можете использовать основной редактор изображений для преобразования вашего логотипа или другого изображения в формат .ico. Есть бесплатные опции, такие как Gimp, которые могут делать такие великолепные иконки на основе существующего изображения лучше, чем онлайн-генераторы иконок.

1 голос
/ 09 декабря 2015

Чтобы создать значок для всех платформ (не только для настольных браузеров), вы можете использовать RealFaviconGenerator и камень rails_real_favicon:

  • Перейти к RealFaviconGenerator и отправьте свою фотографию.Вы можете создать свой значок, платформу для каждой платформы: iOS, Android и т. Д.
  • Когда ваш значок будет готов, перейдите на вкладку «Rails», чтобы получить инструкции по установке вашего значка в проекте Rails.В основном вам будет предложено:
    • Добавить к вам гем rails_real_favicon Gemfile
    • Создать новый файл с именем favicon.json.В этом файле описаны только что созданные вами значки.
    • Запустите rails generate favicon, чтобы фактически создать значки и HTML-код.
    • Добавьте render 'favicon' в макеты, чтобы вставить код HTML в свой код.страниц.

Преимущество этого решения заключается в том, что оно внедряет файлы favicon (favicon.ico, apple-touch-icon.png, но также browserconfig.xml и manifest.json) вконвейер активов.

Полное раскрытие: я автор RealFaviconGenerator.

1 голос
/ 10 июля 2015

Не делали этого годами, но Gimp способен сохранять файлы .ico с несколькими изображениями разных размеров. Вам просто нужно экспортировать в формат .ico с некоторыми видимыми слоями.

1 голос
/ 31 декабря 2012

Я попробовал ссылки выше, и услуги были не очень просты в использовании. Я нашел эту ссылку на другом сайте, она безупречно скопировала мой файл .png и была очень проста в использовании. Я думал, что тоже поделюсь этой ссылкой, так как считаю, что это лучший сервис.

http://www.chami.com/html-kit/services/favicon/

0 голосов
/ 22 августа 2017

У меня была проблема, когда я помещал файл в /public/favicon.ico, я использую AWS EBS.

Я мог бы исправить ошибку.

Лучшее решение для меня было поместить файл в /app/assets/images/favicon.ico и использовать = favicon_link_tag 'favicon.ico'

Страница:
...