Search code examples
htmlrubyrails-activestorage

Rails - Opening an image in new tab using Active Storage


Please be patient with me as I am very new to Rails and this is my first question on StackOverflow.

I have searched this question in many different ways and have yet to find a solution that will work for me. I have a feeling I am close but perhaps my syntax is off a little bit, or i should be trying to call a different method. any help would be appreciated.

Anyways, onto my problem.

I am creating a web application that will allow users to upload photo albums. I have the Users/Albums/Categories/ etc.. all working fine. When a guest selects a users profile they are presented with the albums tied to/ created by that user. if the guest then selects the album they are then taken to the album_show page which shows all of the images in the album (sized at 200x200) which is working exactly as it should. What i cannot get to work is that I want a guest to be able to click on one of the photos in the album and have a new tab open with the full size image. I am currently trying to use this

#album_show
<% @album.images.each do |image| %>
  <%= link_to image_tag(image.variant(resize: "200x200")), path_to :image, target: :_blank %>
<% end %>

Ive tried subbing out the " path_to :image)," and replacing it with a website like "google.com" and it works as would be expected. clicking on an image opens a new tab at google.com" (i did this just to see if the rest of the code was working properly)

so what I need to know is what do i put instead of " path_to :image," in order to open a full size version of the image clicked on, in a new tab?

thank you in advance for your help, and I am aware this is a noob question haha


Solution

  • There are few ways to do it. You can use following line instead of your link_to link. This is exactly you wanted to do.

          <%= link_to image_tag(image.variant(resize: "200x200")), image %>
    

    Another way of doing it using href.

    <a href="<%= url_for image %>"><%= image_tag(image.variant(resize: "200x200")) %></a>
    

    This will solve your issue.