5.9. Adding a Bit of Style

One of the main reasons why you still can't quite call the output of the scaffold generator a blog is that it doesn't look like one. Create a couple more articles in order to have at least three of them to work with, and let's add some style.

To get a nice looking blog, you'll need a few stylesheet files and a few images. In a real-life scenario these would be provided to you by your Web designer. In order to follow along, download the code for this chapter from the wrox.com site and copy the stylesheets contained in the project_files folder, into the public\stylesheets directory of your project. Similarly, copy over the three images from the project_files folder you just downloaded into your public\images directory. Also delete rails.png from that same directory, and public\stylesheets\scaffold.css because you won't need them anymore.

You'll start your customization by modifying the articles.html.erb layout. In this example I call the blog "The Rails Noob," so the first thing you can do is change the title tag:

<title>The Rails Noob</title>

Next, you need to link to the main stylesheet, which is going to be site.css:

<%= stylesheet_link_tag 'site' %>

You can add a logo (linked to the homepage) in plain HTML or by using the image_tag helper:

<%= link_to image_tag('logo.png', :width => '350', :alt => "The Rails Noob"), root_
path %>

You'll also need to add a few tags, and ids and classes attributes to give the blog a bit of structure and style. Listing ...

Get Ruby on Rails® for Microsoft Developers now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.