How to show dates and times separately? I have set up events with calendaring on my site along with an agenda view. Each event has a date, possible start time, possible end time, and possible end date/time.

Therefor I have two date fields associated with this content type - field_date(value, value2) where value is the start date/time and value2 is the end date/time.

How can I show dates and times separately so that I can use CSS to make a pretty agenda view using something like the following markup?

&lt;div class="item even"&gt;
&lt;span class="event-month-day"&gt;September 21&lt;/span&gt;&lt;br&gt;
&lt;span class="event-title"&gt;Fall Solstice (all-day-event)&lt;/span&gt;
&lt;/div&gt;

&lt;div class="item even"&gt;
&lt;span class="event-month-day"&gt;October 18&lt;/span&gt;&lt;br&gt;
&lt;span class="event-title"&gt;Fall Festival&lt;/span&gt;&lt;br&gt;
&lt;span class="event-time"&gt;10:00 am to 11:00 pm&lt;/span&gt;
&lt;/div&gt;

&lt;div class="item even"&gt;
&lt;span class="event-month-day"&gt;October 21-25&lt;/span&gt;&lt;br&gt;
&lt;span class="event-title"&gt;Sign up for pie eating contest&lt;/span&gt;&lt;br&gt;
&lt;span class="event-time"&gt;9:00 am to 4:00 pm&lt;/span&gt;
&lt;/div&gt;


I've looked at using the formatter module (explained here: how do I add extra classes to a date field at views?) but could not figure out how to use the formatter with two date variables for my Event content type.

Any help?
I had to do something similar recently. I created a views page and outputted the same Date field twice. I also had two different date formats set up. One showing only Month and Day, and the other format only showing time. Then I assigned the first "Date" field the date format, and the other the "time" format. Afterwards I was able to style them as I pleased.

In the field date settings, I had it to where it also showed multiple, but only first and last with a " - " seperator in order to output "September 11 - September 14" for example. The same can be done for the time formatted field.