This article wants to give you a basic idea of how to create a blog in a Rails app based on Scrivito. It guides you through building a little test app, a site containing a simple blog and some blog articles on it. We won't go into too much detail but, if required, point you to other, more elaborative articles instead.

It makes no difference whether the website you are creating with Scrivito represents a blog in itself or should only contain one. The underlying principles are the same.

To summarize the key aspects of a blog as it will be outlined here: we require models and views for individual blog posts as well as a blog overview page. The latter should offer pagination. We would also like to support commenting and will implement this using a third-party service, disqus.

There should be an easy way to create blog posts, and they should automatically appear on the blog once published. Therefore, we'll create a BlogPostPage model and later use search functionality to find all instances of this model.

We'd like the blog posts to be taggable. Also, each of them should be provided with an abstract which can be displayed on an overview page. So, we require corresponding attributes, tags and abstract.

Let's go ahead and generate the BlogPostPage model. Note that you can omit the “Page” suffix because the page generator automatically appends it if it's missing:

Now, extend the new model so that it includes the required attributes:

Note that you can also specify model attributes in the generator call by appending them as arguments, e.g. title:string, to it.

As you can see, we've added two other attributes that could be useful for sorting the blog posts later on: created and author. The actual content of a blogpost will be stored in its body attribute. The created attribute is automatically set to the current date using the defaults API.

Next, let's provide the blog post view:

For now, the view simply consists of helper calls for rendering the attributes of a blogpost.

When creating a blog, you will need an entry or overview page, on which, for example, abstracts of the first ten or so posts could be displayed. We'll name the model of the overview page BlogOverviewPage. You can generate the model in exactly the same manner as before:

We require some kind of pagination on this overview page. If you have done the Pagination tutorial, you are already familiar with the concept. So, let's use this for our overview page. First, create the view:

Then provide the controller:

POSTS_PER_PAGE lets you adjust the number blog posts per page to your needs.

We still need an instance of the blog overview page. Open the rails console and run the following commands:

Now that there's an instance of the blog, we'd like it to be easily accessible. That's why we created a Permalink named “blog.”

If you switch to the working copy you just created, you can navigate to http://127.0.0.1:3000/scrivito/blog where you should see the overview page. However, it's empty except for the “Blog” title. Just create a couple of blogposts using the “Create page” item from the page menu, then revisit your blog overview. You should see something like this:

This example utilizes disqus to support discussions on blog posts. If you already have a disqus account or don't mind creating one on disqus.com, choose “Add Disqus To Site” from the top right menu. Memorize the shortname, and then create the comments view:

Now, all that's missing is to render the comments into the blog posts by appending the following line to the blog post view:

Tags are convenient for categorizing blogposts by the topics they cover. Offering the tags as filters makes it easy for visitors to choose a topic they are interested in.

To achieve this, we're going to render a small tag cloud on the overview page. If one of the tags is clicked, we want it to be passed to the controller. We'll do this via the “tag” parameter. This way, we can filter the BlogPostPage instances by the given tag.

We already have the tags attribute to work with in our BlogPostPage model definition. In this attribute the tags of each blog post are stored. So, in our BlogOverviewPageController, if a tag was passed to it, we can search for posts whose tags attribute contains this tag. Go ahead and change the controller to:

It would be convenient to have a method in our model that finds a decent amount of tags for use in the tag cloud view. So, let's define one on the BlogPostPage class and call it all_tags. We'll add it to the blog overview page:

Now that everything has been prepared, go ahead and create the tag cloud view. It iterates over the tags returned by the BlogPostPage.all_tags method and creates a link for each of them, pointing to the filtered search. Note that the facet method used in the helper already gives us the name as well as the count of a tag. Take a look at the SDK documentation on faceting for further information.

Next, we add the tag cloud to our overview page. Of course you could also add it to every blog post. We are working with bootstrap classes, so in case you aren't using it, you might want to modify the view or add your own CSS rules.

At this point, you can change the tags of a page only on the console. So, finally, we want to enable editors to easily add and remove them. Just add a tag editor to the details view of the BlogPostPage:

That's it! You've created a blog that supports commenting and utilizes tags! Happy blogging!