We're going to show you how to create an event calendar in Drupal.
This tutorial is ideal for people who want to show a monthly, weekly or daily list of upcoming events.
First, we'll show you how to set up a basic Calendar and then we'll modify it to the needs of your content.
Installation
You'll need to enable and install these modules:
When you're enabling these modules, make sure to enable both Date API and Date Views.
Setting up the calendar
Go to Structure > Views > Add view from template.
You'll now see a variety of default Views that can be created.
-
Click add next to "A calendar view of the 'created' field in the 'node' base table".
-
Choose a name of your new Calendar view.
-
Click Continue,
-
Scroll to the bottom of the page for the preview.
-
You'll see that there's a calendar view with content inside.
-
Click Save in the top-right corner of your View.
-
Visit the site's homepage.
-
There will be a link in the Navigation menu to your Calendar.
-
You'll see your calendar on your site. The first tab will be a Month view.
-
Click the tabs across the top to get a Week, Day and Year view:
At the moment the calendar looks good, but we have some problems:
-
The calendar is showing all of the content on our site, not just events.
-
The calendar is sorting the content by the date it was published, not the date the event is happening.
Let's modify the calendar to fix those problems.
Modifying the Calendar
The first thing we need to do is make sure we have a place to list our Events. If you haven't done so yet. we'll create a content type called Events.
-
Go to Structure > Content types > Add content type
-
Enter Events as the Name
-
Click Save and add fields
-
Create a field called Date and choose Date as the type of data to store.
-
Click Save, then Save field settings, then Save settings.
Your Events content type should like at least a little like this:
-
Go to Structure > Views
-
Click Edit in the row for our Calendar view.
We need to change two things on the left-hand side of our view. We need to change:
-
Fields
-
Filter Criteria
-
Sort Criteria
First, let's change the Fields. We're going to remove the date that the content was posted to our site.
-
Click Content: Post Date
-
Click Remove
Now we're going add the date of the events:
-
Click Add next to Fields.
-
Choose Content: Date
-
Click Apply (all displays) twice
When you're finished, your Fields area will look like this.
Second, we're going to use Filter Criteria to make sure that only our Events show on the calendar.
-
Click Add next to Filter Criteria.
-
Choose Content: Type
-
Click Apply (all displays)
-
Choose "Is one of" and then "Events".
-
Click Apply (all displays)
Your Filter Criteria will look like this:
Now we need to look to the right-hand side of our Views editing screen.
-
Under Contextual Filters, click Date: Date (node) (Content: Post date)
-
At the top of the screen, make sure you are configuring this option for All displays:
-
Uncheck Content: Post date
-
Check Content: Date (field_date)
-
Click Apply (all displays)
-
Check the preview of your view and your events should be showing on the date they will happen.
-
Click Save
-
Visit your finished calendar on the front of your site.