Hide start time in FullCalendar

Question

On FullCalendar, in the month view, is there a way to hide an event\'s start time?

Answer 1

Try this, it works for me:

$('#calendar').fullCalendar({
     displayEventTime : false
});

That should hide the start time in the title event.

Answer 2

Another way is to add an eventRender function. This way you can choose to not render the time, and do something else like append some data to the event.

eventRender: function(event, element) { 
    element.find('.fc-event-title').append("<br/>" + event.location); 
    element.find('.fc-event-time').hide();
}

Answer 3

I know it has been three months since you asked the question. But, if you and I are trying to do the same thing than someone else may be looking for the answer.

In the fullcalendar.js file, comment line 1603:

htmlEscape(formatDates(event.start, event.end, view.option('timeFormat'), options)) +

This is not a fix, at best it is a hack, but it works.

Answer 4

In case you completely want to remove the Start time, you can use the below code

$('#calendar-canvas').fullCalendar({
    header: {
        left: 'today prev,next title',
        right: 'agendaDay,agendaWeek,month'
    },
    firstDay: 1,
    eventRender: function(event, element) {
        $(element).find(".fc-event-time").remove();
    }
});

Answer 5

add the following style to your css

.fc-event-time{
   display : none;
}

or in version 2+:

.fc-time{
   display : none;
}

Answer 6

.fc-time-grid-event.fc-short .fc-time,.fc-time-grid-event .fc-time{
        display: none !important;
    }

Above code will correct it in all views.

code below has a flow that shows time in large view of event

 .fc-time-grid-event.fc-short .fc-time{
            display: none !important;
        }

please use this code in css to hide the time only from event.

using just

.fc-time{
        display: none !important;
    }

will also hide the time at left grid.