Forums (Obsolete)

Old Forums

Design and CSS styles

Version 4.x > Design and CSS styles > Question on how to Create a Custom Calendar Layout

View modes:

Member

brian-haveninteractive - 8/18/2009 3:03:52 PM

Question on how to Create a Custom Calendar Layout

I want to edit the code that gets generated when using the EventCalendar Web Part. For instance, I want to change the HTML that is generated for each cell to not include align="center", and I want to add somehting like valign="top".

I cannot find where this HTML code is coming from. I looked in CMSWebParts/Events/EventCalendar.ascx and .cs; and also in CMSWebParts/Viewers/cmscalendar.ascx and .cs.

I do not see in any of those files where that HTML table that surrounds the events that are listed in being generated. The transformations for the events themselves do me no good to edit because this HTML table is forcing the alignment of the table cells that end up containing those transformations.

Any help would be appreciated. Thanks.

Member

brian-haveninteractive - 8/19/2009 2:08:57 PM

RE:Question on how to Create a Custom Calendar Layout

I figured out that you need to apply properties to the ASP.NET Calendar Control that the CMS uses.

SOME HELPFUL ARTICLES:
http://msdn.microsoft.com/en-us/library/w4s946c9.aspx
http://www.w3schools.com/aspnet/control_calendar.asp

EXAMPLE (from EventCalendar.ascx):

<div class="Calendar">
    <cms:CMSCalendar ID="calItems" ShowGridLines="True" BorderColor="#7d4c1a" BorderStyle="solid" BorderWidth="1px" runat="server">     
     <DayHeaderStyle BackColor="#d3d3d3" ForeColor="#5e6f76" BorderColor="#7d4c1a" BorderStyle="solid" BorderWidth="1px" />
     <DayStyle BackColor="#f2edda" BorderColor="#7d4c1a" VerticalAlign="Top" BorderStyle="solid" BorderWidth="1px" />
     <TodayDayStyle BackColor="#d3d3d3" />
     <WeekendDayStyle BackColor="#dad3b9" />
     <OtherMonthDayStyle BackColor="#e3e3e3" ForeColor="#5e6f76" />    
    </cms:CMSCalendar>
</div>


Kentico Developer	kentico_martind - 8/24/2009 2:42:59 PM RE:Question on how to Create a Custom Calendar Layout Hi Brian, Thank you for links and example. You can also specify these properties in skin file to keep them different for different stylesheets. You can find more details in 'App themes' article. Best Regards, Martin Dobsicek

Top