You can add a header or footer to your calendar if you want to display additional information or if you want to enhance the visual appearance of your calendar.
The following calendar illustrates the header and footer elements:
You can customize the header and footer through the template editor. The template editor is accessible through C1Calendar's context menu or its Tasks menu:
To access the template editor through C1Calendar's context menu:
Right-click on the calendar control, select Edit Template, and choose Header and Footer.
To access the template editor through the C1Calendar Tasks menu:
Click the calendar control’s smart tag, select Edit Template from its Tasks menu, and choose Header and Footer from the Display drop-down list.
The C1Calendar control goes into template editing mode and the Calendar Header and Calendar Footer template editors appear since the display is set to Header and Footer.
You can drag and drop arbitrary controls into the calendar header or footer and then modify the embedded control's properties through its Properties window. For example, if you added a Label control to the Header you would right-click the Label control and select Properties to modify its properties.
Once you have embedded the controls into the header or footer, select End Template Editing to end the template editing mode.
C1Calendar will add the HTML Header and Footer tags to its .aspx file. You can further customize the embedded control or you can add additional text, hyperlinks, images, and so on through HTML code.
For example, the following HTML code shows the embedded label controls added to the Header and Footer tags:
<cc1:C1Calendar ID="C1Calendar1" runat="server" skin="Blue">
<FooterTemplate>
<asp:Label ID="Label2" runat="server" Text="This is the Calendar Footer." Width="175px"></asp:Label>
</FooterTemplate>
<HeaderTemplate>
<asp:Label ID="Label1" runat="server" Text="This is the Calendar Header." Width="173px"></asp:Label>
</HeaderTemplate>
</cc1:C1Calendar>
For an example that shows how to add an image to the header and footer templates, see Add a Header and Footer Template.
|
