Support

Home Forums Events Calendar Add-on Customizing Calendar

Customizing Calendar

Posted: January 9, 2014 at 8:21 am

Viewing 1 reply thread


novaopen

January 9, 2014 at 8:21 am

I’d like some basic advise on customizing the calendar. I came across http://arshaw.com/fullcalendar in the forum. Is this the basis for the EE calendar? Would this be a good starting point for customization? Is the EE Calendar a direct port of arshaw.com/fullcalendar? Should I be able to incorporate any of the advanced features from arshaw.com/fullcalendar into EE Calendar?

We have a convention with 80 events on 8/28/14 – 8/31/14. Events run for specific times throughout the week.

Here are a few things, I need to do:
1. Start the view of Calendar to specific week in the future (8/28/14). (use “gotoDate” function).
2. Layout the calendar horizontally like a gantt chart. (I did not see this as an option within arshaw.com/fullcalendar but it would be similiar to how the month layout is done, so I think it is possible.
3. Format the layout so that there is plenty of space so that everything isn’t squeezed to a thin line. I realize that horizontal scrolling may be necessary.

Would I be better off looking for a third party solution and use the JSON API to pass the data to or is customization of the Calendar plugin a realistic undertaking.

I’m a web designer/developer, which is to say I am strong with HTML5 and CSS3 but for PHP and Javascript I work best with modifying code snippets than coding from scratch.

Thoughts? Resources to go to? If I produced a slick tool to get this done, would there be a market for me to resell it within EE?


Josh

  • Support Staff

January 9, 2014 at 10:25 am

Hi Michael,

The Event Espresso calendar uses the fullcalendar jQuery plugin to display events. We wrap it up in a WordPress plugin and add a bunch of settings. It’s also been tweaked to display tooltips and images.

I can point you in the direction on how to customize the calendar’s initial month display:

http://arshaw.com/fullcalendar/docs/current_date/gotoDate/

If you look in espresso_calendar.js, just before the last line that reads }); you’d add:

$('#espresso_calendar').fullCalendar( 'gotoDate', 2014, 7);

Here’s a stackexchange thread that discusses the possibility of a gantt chart-like layout:

http://stackoverflow.com/questions/3269117/adding-a-resource-view-gannt-chart-to-jquery-fullcalendar

Not sure on #3. We try to make the calendar responsive. So if you remove all the max-width: 100% style rules and play with the CSS that might work.

Would I be better off looking for a third party solution and use the JSON API to pass the data to or is customization of the Calendar plugin a realistic undertaking.

That’s certainly a possibility, and we encourage using the JSON API for use cases like this one. Although one thing that you might consider is using the API might be slower than using the native calendar.

With regards to reselling, we don’t currently have a marketplace for selling 3rd party extensions. That’s a good idea though.

Viewing 1 reply thread

The support post ‘Customizing Calendar’ is closed to new replies.

Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.

Event Espresso