How to add a link to an image in Phoenix

Will Ceolin - Jun 11 '22 - - Dev Community

Edit (2023-05-11): This is much simpler in Phoenix 1.7+ thanks to Verified Routes:

<.link navigate={~p"/post/123"}>
  <img src={~p"/images/logo.png"} alt="Logo" />
</.link>
Enter fullscreen mode Exit fullscreen mode

Let's say you have an image and you want to link it to another route in the Phoenix Framework. You can use link/2 with a code block to accomplish that:

<%= link to: Routes.page_path(@conn, :index) do %>
  <img src={Routes.static_path(@conn, "/images/phoenix.png")} alt="Phoenix Framework Logo"/>
<% end %>
Enter fullscreen mode Exit fullscreen mode

In the example above, we'll link the Phoenix logo (phoenix.png) to the home page.

. . . . . . . . . . . . . . . . . . . . . . . . .
Terabox Video Player