Create a Views event list grouped by month

Last updated February 23, 2010. Created by Rowanw on March 2, 2009.
Edited by bekasu. Log in to edit this page.

Views has a feature called grouping, which allows you to split a list of results into arbitrary categories. Basically, if several items fall under the same category then they'll form their own list. For grouping to work though, your view must have a couple of fields, luckily you can use any available field for your groups.

Modules used:

• CCK 6.x-2.x
• Views 6.x-2.x
• Date 6.x-2.x

Create a content type for your events

Using CCK, create a new content type and name it Event. Add a new field named Date and choose Date as the type. Configure the field as you require.

Create a new view

Using Views, add a view named events.

Choose a style for the view, preferably table.

Add the fields Node: Title and Content: Date, these will be visible fields so configure them to look presentable.

Even though we just added the date field, we need to add it a second time so it can be used for grouping. This field should not be presented alongside the other fields, so in the settings check "Exclude from display" and set the label to none.

The reason we need a second field for the date is because we're going to modify its output to return only a month and year.

Now click on the settings icon for the Style option and under Grouping field select our hidden date field.

You may also want to add a filter for Node: Published and Node: Type.

If you preview the view you should notice that each node has been separated into its own group, and each group is headed with a unique date. Since the dates are all unique we don't get any actual groups.

What we need to do now is modify the hidden date field so it only returns the month and year.

Ensure your view has a page or block display type and save it.

Override the date field output

To find out which file we need to copy for theming our field we need to click on the Theme: Information link, this gives us a list of potential file names for various parts of the view. From the list, find the identifier of our hidden field and look at the second suggested file name, in my case it's called: "views-view-field--field-date-value-1.tpl.php". Yours may or may not be different.

To use this file we need to copy the file named "views-view-field.tpl.php" from "sites/all/modules/views/theme" and paste it into our own theme directory. Immediately rename the file to the suggested file name above, include all the hyphens.

Open the new file and replace <?php print $output ?> with:

F = Month
Y = Year

Now when you load the final view you should get a nice grouped list similar to the screenshot.

Customizations

How to customise the date output: http://php.net/manual/en/function.date.php

How to change the look of the text: http://v1.reinspire.net/blog/2005/09/15/css_font_styling/

Caution

If you wonder why your output is not grouping things together, disable Theme developer, and see if that helps.

In case it saves others from scratching their heads, here's something to note about this example:

The reason you write a template is that the grouping field does its comparison based on the output of the template rather than the raw data. This was apparently done to implement things like granular date grouping relatively easily.

One BIG side effect of this is that any tools that monkey with the output, say... THEME DEVELOPER ... will cause what seem like equivalent date strings to be different. More specifically, the output will be wrapped in a tag, that includes a thmr attribute that increments.