Subscribe in a reader
Customizing a Post Layout in Graffiti Thursday, November 15 2007
One of the things I love about Graffiti is how easy it is to make it look good. Something I found myself wanting to do was create an 'about' page, but I don't want to looking like a post. An about page probably shouldn't have a date, tags, comments and other items that aren't relevant. Fortunately, this is really easy to do with Graffiti. Here I'll walk you through the steps required to create an 'about' page with a custom look and feel. I'm going to base this walk-through on the 'Default' theme so you can all follow along. :)
Creating the Post
First off, let's go to the Control Panel and create a new post. We're going to leave the category as 'Uncategorized' and give it a title and some text.
Next we want to add a navigation item to the site so people can find the new page we've created. Let's go to the Presentation page on the Control Panel menu and select Navigation. On that page, select the Posts tab and you should now see the new post we created in the drop down. Select the post and click 'Add to Navigation'.
Now you should see an option to view your about page on your site. As you can see, we're using the default post view here, so it's showing the date and the fact that the post is uncategorized. Now we'll add the new file to make this page look more like an About page.
Creating the New View
In the Control Panel, go to Presentation->Themes and you will see link below the 'Default' theme to 'Personalize' it. Clicking that link will take you to the 'Edit Theme' page. Click 'Create new file' and call the file 'about.view' (note: the name of the file needs to be the same as the post name, so if you called your post 'About Me' the file name should be 'about-me.view'). Save the new page and you will be taken to a page where you can edit the content. This page has a cool little drop down menu above it where you can insert 'tokens' that will pull data from Graffiti and show it on your page.
All we want for this page is to display the title and the body, so we'll add the HTML and the tokens to the view to do that.
Now when we view our About page*, all we see is the title and the body as we want it.
Conclusion
Hopefully this post will have shown you just how flexible Graffiti is. The same theory shown here works with categories so for example, if you create a category called 'Articles', you can create a theme file called 'articles.view' with a custom view of the list of posts or any other formatting you want. To change how each post looks in the articles category, simply create a view file called 'articles.post.view'. Easy, huh? I'd love to hear any questions or feedback you might have so leave a comment or email me via my contact page.
* Due to caching, currently it will take a few minutes until the view becomes available. This may change in a future release as this article is based on a pre-beta of Graffiti.
Very cool! It looks so easy to use.
The ability to edit the theme files within the control panel reminds me of WordPress and was a very handy feature when I used to have a WordPress powered blog.
Keep the articles coming!