In this lesson, we're going to play a little bit with rendering to learn some new things, including how to work with the image_tag view template helper method provided from Rails through the ActionView module.

Go to index.html.erb in the app/views/posts folder, and this what you'll see.

This table is not really needed because we can do better with a different layout.

Let's remove the tables, and any other tag associated with it such as <tr> and <td>. Let's also change the h1 header to Photo Blog. This is how the code should you look like after you remove the table.

Next, let's remove the Show link, and instead have a link at the title, so users can simply click on the title to see that record. To do that, remove the code on line #9, and make this change to the code on line #6.

<%= link_to post.title, post %>

Let's also add a <h2> tag to the title, and give a break before the Edit link to make it more appealing. Though this is not a design course by any means, these small changes help you to learn some things you can do to make your application look better.

Now, lets start the server and see how it looks like in the browser. This is how it looks.

Next, we have to render the image, so it looks like a photo blog.

We'll just do what we did before. We'll use the image_tag method, but will call the tiny version instead of profile.

So, the code on line #7 is:

<%= image_tag(post.image.tiny.url) %>

If you refresh the browser, you can see this screen.

You can play around with the sizes if you think this is too small for you. Also, you can experiment more with the display using a combination of different tags.