DotNetNuke® Guided Tour

Using the Events Module

The Events module displays a list of upcoming events, including date, time and description. Events can alternately be set to render in a calendar or list format.

Use what you learned in Add Module to Page to add a new Events Module to your Page.

Step By Step: Add a New Event

Your Module is initially created with no content.  Only the empty Container is visible, with its Title and Action Buttons visible and an empty calendar.

1.   Click the Add New Event button at the bottom (or select Add New Event from the Module Actions Menu).

On the Edit Events page you'll see that there are several fields you can fill out plus the same WYSIWYG editor used for the Text/HTML (and other) modules, and the same "file picker" used in the Documents (and other) modules.

2.  Place your cursor in the Title field and enter a short phrase for your Event text.  This is the value that will be displayed on the calendar (or in the list view).

3.   Place your cursor in the rich text editor and enter a Description for your event.  The description will display below the title.  You can use any of the features of the editor, such as adding links or text colors and styles.

4.   (Optional Step) Select an Image to use in the calendar (or upload a new one).  If you want to use an image, make sure to consider the its size... the image will display inside the date box (on the calendar) or beside the entry (in the list view).

You can also add Alternate Text for the image.

6.   Specify the Start Date for the Event.  If your event is just one day, that's all you need to do.  Optionally, if your event spans days or is recurring (e.g. every Monday) you can specify that too.  A Start Time is also optional.

8.   When you have finished, be sure to click Update at the bottom of the page to save your changes.  This is how your updated module would look to a website visitor.

But this is just the default look for an Events module.  There are a few display options available.

Step By Step: Display Options

The Events module has a few Display Options which let you change how it looks.

1.   Click the Settings button (or select Settings from the Module Actions Menu).


2.   On the Module Settings page, scroll down to Events Settings and click the button to expand the section.  This will show you all the available Events module options (options in the other portions of this page are general module options).

3.   (Optional Step) Specify a Calendar Cell Width and/or Calendar Cell Height to keep your calendar size constant (instead of resizing with content).

So your calendar would look something like this:

4.   (Optional Step) Specify Display Format as List (instead of Calendar).  With this setting the Calendar Cell Width & Height have no effect and your calendar displays with a list view like this!

In the list view, there is much more room for extended Descriptions so if you have a lot of information to include about your Event... the list view may be better for you!

Powered By DotNetNuke®