Kentico CMS 7.0 Developer's Guide

Using the Event calendar with other document types

Using the Event calendar with other document types

Previous topic Next topic Mail us feedback on this topic!  

Using the Event calendar with other document types

Previous topic Next topic JavaScript is required for the print function Mail us feedback on this topic!  

The Event calendar web part can not only display Event (booking system) documents, but also documents of any other type that have a date-time field. All you have to do is specify the date-time field in the Date field property of the web part. This way, you can for example display news in a calendar according to their publish date.

 

In the following example, you will learn how to use the Event calendar web part to display news from the News section of the sample Corporate Site.

 

1. Sign in to CMS Desk and on the Content tab, select the News document in the content tree. View it on the Design tab and click the Add web part (AddWebPart) icon of the Main zone web part zone.

 

devguide_clip1580

 

2. Choose the Event calendar web part and click OK. In the web part properties dialog, configure its properties as follows:

 

Show for document types: CMS.MenuItem; this ensures that the calendar will only be displayed in the list of news and not when a particular news item is viewed.

Path: /News/%; path to the news documents to be displayed.

Event start field: NewsReleaseDate; news will be displayed in respective calendar days based on the value in this field.

Document types: CMS.News; this ensures that only news documents stored in the path will be displayed.

Skin ID: EventCalendar; skin applied to the calendar.

Transformation: click the New button and create the following transformation: <a href="<%# GetDocumentUrl() %>"><%# Eval("NewsTitle", true) %></a><br/>

Content before: <div style="width: 600px;">; this just ensures that the calendar will have limited width so that it doesn't span over the whole web part zone.

Content after: </div>

 

Leave the rest of the properties at their default values and click OK.

 

3. Now if you go to the live site and view the News page, you should see the calendar below the list of news. If you browse to the appropriate month where the sample news are published (or if you create your own sample news with a current date), you should see the news in the calendar. After clicking the news title, you should be redirected to the particular news item's detailed view.

 

devguide_clip1581