Ghazarios
Ghazarios

Reputation: 13

Can't link to image with HTML on Rails app

I'm developing a Web app using Ruby on Rails. I have an image to add to the site, and I tried using the "img src" HTML tag to call a local image, but it won't work. If I use ruby to call it using the "image-tag" method, it works fine. I'm just wondering as to why it never works with HTML.

For example, I add an image to app>assets>images>image1.png

On the View file, I add HMTL as follows:

 <img src="/app/assets/images/image1.png">

It doesn't load

Yet if I enter this code in the same spot:

<%= image-tag: "image1.png" %>

It works fine.

Does anyone know why this is happening? I know I have a workaround, but I would rather know why my HTML tag has an issue with local files, yet links to files on the internet just fine. I'm new to coding. Cheers!

Upvotes: 1

Views: 2261

Answers (5)

Dmitriy Pankratov
Dmitriy Pankratov

Reputation: 206

If you want use img tag you should:

<img src="<%= asset_path('image1.png') %>"/>

Without "/images" and "/".

Upvotes: 3

Sculper
Sculper

Reputation: 755

The problem is the path you're using. Here's the short version: Remove app/ from the image URL, and it should work as expected.

If you run the app with the working code, you can see that this is what image_tag is already doing for you behind the scenes by inspecting the HTML. You should see something like this:

<img src="/assets/images/image1.png">

Updating your img tag to use that path should resolve the issue.

However, you should be using image_tag if possible! Without delving too deep into the technical details, if you deploy your site to production with the image_tag version and take a look at the HTML, you'll probably see something like this:

<img src="/assets/images/image1-[sequence of characters].png">

This will help ensure that clients are removing stale assets from their caches as necessary - the technical details can be found here (see section 1.2). If you hard-code the image, you're going to miss out on any features provided by the asset pipeline.

Upvotes: 0

Mike Retzak
Mike Retzak

Reputation: 11

Looks like your syntax is incorrect for the image_tag helper. Try this:

<%= image_tag "image1.png" %>

More info in the Rails docs

Upvotes: 0

Douglas Lovell
Douglas Lovell

Reputation: 1607

Nice question. The Rails asset compiler is important but makes some problems like this one.

The asset compiler is likely adding a cache fingerprint to the file name. You can use <%=asset_path('images/image1.png')%> as the value of the src attribute, or continue using image_tag.

See the Rails guide assets document for more information.

Does that help?

Upvotes: 2

aaron lilly
aaron lilly

Reputation: 274

can you try with a online based example ? My guess is ruby isn't finding your image within the directory.

<img src ="https://upload.wikimedia.org/wikipedia/commons/thumb/3/32/Googleplex_HQ_%28cropped%29.jpg/250px-Googleplex_HQ_%28cropped%29.jpg"> </img>

Upvotes: 0

Related Questions