Create a List Tab For Drupal Calendar
Introduction and Requirements
Drupal’s Calendar module allows an easy way for site builders to display events in a month, week day and year format right out of the box. However, I recently needed to add an additional tab to the view display to list all upcoming events. The requirements were that this would become the default display for the view, meaning that the list would display be default if user didn’t supply any arguments to the URL. For example, if the user navigated to example.com/events they would see the list of all upcoming events instead of the month view. In order to follow along in this tutorial you will need a content type that is using a Date field with an end date. You will also need the Calendar module installed.
Below is what we will be creating.
Note that the All tab displays first by default, and displays all upcoming events in a list.
Create a Calendar From Template
-
Navigate to the Views configuration page admin/structure/views and click Add view from template
-
Find the Calendar view that utilizes a Date field, and click add. In my case, my date field is called field_date.
Add a New Tab to the Calendar to List All Events
-
First, let’s update the path for all the displays (Month, Week, Day and Year). By default it’s set to use the field name. Let’s update it to use events. Below are my final paths.
- Month: events/month
- Week: events/week
- Day: events/day
- Year: events/year
-
Now we need to remove the Month view as the Parent menu item. Go to the Month view and click the Tab: Month link.
-
Select Menu tab. Configure the tab using the following info.
Title Description Menu Weight Month Leave Blank Navigation 0 -
Add a new page.
-
Set the path to events/all
-
Under Menu: set the type to Default menu tab and click Apply
-
On the next screen, configure the tab using the following info.
Parent menu item Title Description Menu Normal menu item Events Navigation Leave Blank Navigation -
Under Format change the format from Calendar to Unformatted list. Make sure to to select This page (override).
-
Under Format show fields. Make sure to to select This page (override).
-
Under FILTER CRITERIA add Date: Date (node)
-
One the next screen, leave all the defaults. Select the start date field of the date field you are displaying in the calendar views.
-
One the next screen set the Operator to Is greater than or equal to the Relative date of 12AM today.
-
Save the view.
