Display a Calendar On Taxonomy Pages In Drupal

Posted on May 14, 2016 - 5 Minute Read

Introduction and Requirements

Let's say you have a content type with a date field and term reference field. This content type could be specifically for events. Because of this, you most likely would like to display this content type in a calendar format. Luckily, Drupal's Calendar module does just that. However, if a user were to visit any of the term pages associated with that content type, they would simply get a list of content by default.

fin 1

The above image shows the default display for a term with a date field.

In this tutorial, I will show you how to update the term page display to display a calendar of nodes with that term, rather than a list.

fin 2

The above image shows the the same term display, this time in a calendar format.

Before we start, make sure you have the following configured:

  1. Have a content type with a date field
  2. This content type must also have a term reference field (preferably one not being used by other content types)
  3. Install the m following modules.

    1. Calendar
    2. Date
    3. Taxonomy Display
    4. Pathauto

In this tutorial my content type is called Date the date field is called field_date and my vocabulary is called Date Category.

Update Taxonomy Term Path

Update your path for the term being used in the term reference field to the following:

dates/[term:name]/month

2 1

If you have existing terms, you will need to delete their aliases and then bulk generate them.

Create a New Calendar Display From Template

Navigate to /admin/structure/views/add-template and create a new calendar view from template. Make sure you add a calendar using your specific date field. In my case it's field_date.

3 1

  1. Name your view. I named mine Calendar Term Display

3 2

  1. On the month display, add a contextual filter for Content: Has taxonomy term ID

3 3

  1. Under WHEN THE FILTER VALUE IS ** NOT ** IN THE URL , configure the following:

3 4

  1. Provide default value = enabled
  2. Type = Taxonomy term ID from URL
  3. Load default filter from term page = enabled
  4. Click Apply (this display)
  5. Rearrange the order of the contextual filters so that the Content: Has taxonomy term ID appears first​

3 6

  1. Under PAGE SETTINGS update the path to the dates/%/month/%. This is based off of the pattern we created earlier for the term being referenced. The first % represents the term ID and the second % represents the start date.

3 7

  1. Also under PAGE SETTINGS update the Menu to No menu entry

1

  1. Under PAGER update the Link format to Pager in the settings section.

2

3

  1. Finally, under OTHER enable AJAX

4

  1. Save the view

Update the Term Page Display

  1. Navigate to your vocabulary's display settings at admin/structure/taxonomy/your_vocabulary/display
  2. Enable Taxonomy term page and click Save

4 1

  1. Now click Taxonomy term page in the upper right hand corner

4 2

  1. Set Term display to hidden

4 3

  1. Set Associated content display to Views

4 4

  1. Set the View to the view we just created (in my case it's Calendar Term Display ), and set the View's display to Month

4 5

  1. Click Save
Categorized In:Tagged In: