如何在rails 3.2中添加favicon

时间：2012-03-28 06:00:27

标签： ruby-on-rails favicon

我知道新的rails应用程序带有一个空的favicon.ico文件。我想知道如何添加一个favicon。我知道你可以使用favicon_link_tag助手，但我不知道如何填充favicon.ico文件。你使用favicon发电机吗？如果是这样，哪一个最好？

我也希望能够缓存它，rails也会自动执行此操作吗？

由于

11 个答案:

答案 0 :(得分：112)

只需将其添加到布局的<head></head>部分：

<%= favicon_link_tag 'favicon.ico' %>

如果您正在使用资产管道，请将favicon.ico图片放在/app/assets/images/中，如果不是，则将/public/images/放在 config.relative_url_root = "" 。

此外，如果将Ruby 2.0与Rails 3.0.20（也可能是3.0.x）一起使用会有一个错误，这会在尝试渲染favicon.ico时引发异常。

修复方法是将以下代码放入application_controller.rb：

{{1}}

答案 1 :(得分：69)

在此处生成您的favicon：http://www.favicon.cc/ 并放入公共/目录

<强>更新 公用文件夹中的Favicon未预编译，可能会被缓存很长时间。 看起来最好使用favicon_link_tag来避免favicon更新问题。我不知道浏览器在root中需要favicon。根据{{​​3}}所有现代浏览器维护

<link rel="shortcut icon" href="favicon path" /> (favicon_link_tag)

答案 2 :(得分：9)

虽然所有这些答案都是为了创建一个16x16图标，但实际情况是你应该创建一个16x16和32x32，以支持视网膜显示。这些在线发电机都没有做得很好。

在Mac上，有一个名为Icon Slate的5美元应用程序，它允许您在单个ICO文件中轻松创建两种格式。

在Windows上，我已经使用Axialis IconWorkshop取得了巨大的成功，但它是一个更重要的工具，并且在50欧元左右的价格要贵得多。

两者都将创建一个包含16x16和32x32图像的ico文件。

如果您正在使用资产管道，请使用app / assets / images文件夹而不是/ public。忽略link标签的边缘浏览器的数量正在快速接近零，因此跳过环以适应它们是不值得的。

如其他答案所述，请在head中使用此功能显示它：

<%= favicon_link_tag 'favicon.ico' %>

答案 3 :(得分：5)

我强烈推荐这个选项。它易于使用和免费 http://converticon.com

答案 4 :(得分：3)

写入 application.html.haml ：

= favicon_link_tag '/images/favicon.ico'

在目录中放置文件 favicon.ico ：

project/public/images

答案 5 :(得分：2)

您几乎需要一个名为favicon.ico的16x16像素图像文件，并且必须在您网站的根目录中公开提供。

您始终可以使用主要图像编辑器将徽标或其他图像转换为.ico格式。像Gimp这样的免费选项可以比在线图标生成器更好地基于现有图像制作出如此棒的图标。

答案 6 :(得分：1)

我尝试了上面的链接，服务并不是很简单。我在另一个网站上找到了这个链接，它完美地复制了我的.png文件，并且使用起来非常简单。我想我也会分享这个链接，因为我觉得这是一个更好的服务。

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

答案 7 :(得分：1)

Haven已经做了多年，但是Gimp能够保存具有不同大小的多个图像的.ico文件。 您只需要使用一些可见的图层导出.ico格式。

答案 8 :(得分：1)

要为所有平台生成图标（不仅适用于桌面浏览器），您可以使用RealFaviconGenerator和rails_real_favicon gem：

  • 转到RealFaviconGenerator并提交您的照片。您可以为每个平台制作图标，平台：iOS，Android等。
  • 一旦您的图标准备就绪，请点击＆＃34; Rails＆＃34;选项卡以获取在Rails项目中安装favicon的步骤。基本上，你会被要求：
    • 将rails_real_favicon gem添加到Gemfile
    • 创建名为favicon.json的新文件。此文件描述了您刚刚设计的图标。
    • 运行rails generate favicon以实际创建图标和HTML代码。
    • 在布局中添加render 'favicon'以在页面中插入HTML代码。

此解决方案的优势在于它会在资产管道中注入favicon文件（favicon.ico，apple-touch-icon.png以及browserconfig.xml和manifest.json）。

完全披露：我是RealFaviconGenerator的作者。

答案 9 :(得分：0)

我发现对我有用的解决方案是执行以下操作：

  1. 转到http://realfavicongenerator.net/favicon_checker并确认您有一个好的图标。如果你没有，那么使用他们的工具创建一个（加上许多其他有用和相关的图标）。注意：这要求您有一个好的图标（例如PNG）作为图标的基础。
  2. 利用http://realfavicongenerator.net建议使用?v=version选项来帮助解决浏览器缓存问题。这帮助了我。
  3. 将favicon.ico复制到public和app/assets/images。你只需要一个，但如果你不知道哪一个，复制到两个地方都不会伤害......或者你可以试验看哪个有效 - 利用{{1执行测试。
  4. 在app / views / layouts文件（例如application.html.erb）的布局的?v=version部分添加以下行：

    5. <head></head>

    希望这提供了一个简单的配方。我确定如果我错过了什么，有人可以并且会改进这个答案。

答案 10 :(得分：0)

我将文件放入/public/favicon.ico时遇到问题，我正在使用AWS EBS.

我可以解决这个错误。

对我来说更好的解决方案是将文件放入/app/assets/images/favicon.ico并使用= favicon_link_tag 'favicon.ico'

相关问题
最新问题