CODEWITHSUNDEEP
cssruby-on-railsrubyruby-on-rails-4
Nick Schmidt
Nick Schmidt

Reputation: 1527

Rails 4 not right path for image_url

So, my next problem on a rails project is the following: I am using the asset pipeline to serve my assets. Now I want to include inline css into a view with a background image. because of the asset pipeline I am just able to use the helpers that rails offers from ground. But the problem is, that every helper (except image_tag is delivering the wrong output).

image_url('work-1.png')         # => /images/work-1.png
image_path('work-1.png')        # => /images/work-1.png
asset_url('work-1.png')         # => /work-1.png
asset_path('work-1.png')        # => /work-1.png
image_tag('work-1.png')         # => <img ..........> # Only right tag!

Yeah, that didn't help me. And also all other questions I found about this topic.

Would be nice to know what the issue is with this. Thanks!

Upvotes: 0

Views: 3239

Answers (2)

Nick Schmidt
Nick Schmidt

Reputation: 1527

Another question answered myself.

I had the wrong path in the image_path helper. So, if you have a missing image (that cannot be found by the asset pipeline, the helper is falling back to the /images path.

Let's imaging I want to include a path of ph/image-1.png into my document. image_path('ph/image-1.png') will put the right directory with the path. Otherwise, if you are going to use image_path('image-1.png') it will use the /images directory in front of the image you are going to use. But this cannot be found. This was my fault.

To wrap it up, here is the summary:

image_path('ph/image-1.png')              # => /assets/ph/image-1.png
image_path('image-1.png')                 # => /images/image-1.png

Upvotes: 2

ptierno
ptierno

Reputation: 10074

The image_tag helper is the only method out of your list that will actually produce an html tag.

The image_url helper actually use the image_path helper to compute the full path to an image (eg. http://www.example.com/image/image.png)

The image_path helper produces the relative path to an image (eg. /images/foo.png)

image_tag output

image_tag("icon") # => <img alt="Icon" src="/assets/icon" />
image_tag("icon.png") # => <img alt="Icon" src="/assets/icon.png" />
image_tag("icon.png", size: "16x10", alt: "Edit Entry") # => <img src="/assets/icon.png" width="16" height="10" alt="Edit Entry" />
image_tag("/icons/icon.gif", size: "16") # => <img src="/icons/icon.gif" width="16" height="16" alt="Icon" />
image_tag("/icons/icon.gif", height: '32', width: '32') # => <img alt="Icon" height="32" src="/icons/icon.gif" width="32" />
image_tag("/icons/icon.gif", class: "menu_icon") # => <img alt="Icon" class="menu_icon" src="/icons/icon.gif" />

image_path output

image_path("edit")                                         # => "/images/edit"
image_path("edit.png")                                     # => "/images/edit.png"
image_path("icons/edit.png")                               # => "/images/icons/edit.png"
image_path("/icons/edit.png")                              # => "/icons/edit.png"
image_path("http://www.example.com/img/edit.png")          # => "http://www.example.com/img/edit.png"

Upvotes: 2

Related Questions