Generating apple-touch-icon using Rails

Firstly, apple touch icons need to be in PNG format, not JPEG. They should also be named 'apple-touch-icon'.

As for the problem, the first but not ideal solution is to place your apple icon into your public directory and hard code the link.

<link rel="apple-touch-icon" href="/apple-touch-icon.png" />

Alternatively on that same note you could add it /public/images so that the generated link is correct.

I suspect however that a plugin such as bootstrap is appending the link as it sees fit. In the case you are using bootstrap or something similar I would be searching the HAML for 'apple-touch-icon' and seeing what you can find. Most probably something along the lines of:

 %link{:href => "images/apple-touch-icon.png", :rel => "apple-touch-icon"}

If you find it, remove it.

That aside its potentially rails being too smart and realising that the filename/filetype are incorrect and appending the link.

You can create a _favicon.html.erb partial with the following content:

<% %w(76 120 152 167 180).each do |size| %>
  <%= favicon_link_tag "apple-touch-icon-#{size}x#{size}.png", rel: 'apple-touch-icon', type: 'image/png', sizes: "#{size}x#{size}" %>
<% end %>

<% %w(16 32).each do |size| %>
  <%= favicon_link_tag "favicon-#{size}x#{size}.png", rel: 'icon', type: 'image/png', sizes: "#{size}x#{size}" %>
<% end %>

Include it in your application.html.erb:

<%= render 'favicon' %>

This will create apple touch icons and favicons in different sizes (optimized for different devices). You can then generate these icons via one of the many websites out there such as iconifier and place them in your app/assets/images/ directory.

This is what I've done and it works really well for me.