The YOOtheme plugin integrates DPCalendar events and calendars as custom sources into the YOOtheme Pro page builder and offers new elements for any page layout. Beside that the list and event details menu items can be customized with the builder to fit the current design of the web site.
DPCalendar specific classes are turned into UIkit classes to fit better the YOOtheme Pro page builder design.
When adding elements like a grid or list to a template, then DPCalendar events or calendars can be added as dynamic content. For menu items is page content available, for all other menu items are custom sources possible. More information about dynamic content can be found in the Official YOOtheme docs.
The DPCalendar event fields are loaded directly from the form itself. To speed up fields building, the form is cached for a short time. Should there be any issue, with the event fields list. Clear the cache in the CMS cache manager.
All event fields are available as dynamic content attributes. There are some compiled ones which do show some date in an aggregated way:
When creating a template for a list menu item, then are events available as page source where they are fetched by the menu item configuration.
Custom sources allow you to load custom queried DPCalendar events which are not automatically available on the page you are browsing. Like that it is possible to display the upcoming events or other event data from DPCalendar.
A side note, dates are not working in
In DPCalendar it is possible to create a complete new layout for a list or event details menu item. Like that it is possible to integrate DPCalendar even better into your web site. As soon as a template is created for a calendar where the menu item is attached to, then the "Builder" option is available on the respective layout. More information can be found in the official YOOtheme docs about pages and posts.
DPCalendar does come with specific elements which can be placed in any template of YOOtheme Pro. Currently is the event list and calendar element available.
If you want to add external calendars from Google, iCloud or Meetup, then you need to pass them with the plugin identifier. For example with a Google calendar you need to add them like "g-23", where 23 is the id of the calendar in the plugin. Here is a list of identifiers for our external calendars:
The calendar list element offers a fully flexible output for a list of events. It uses the moustache syntax as described in the Output rendering article. The Content plugin needs to be enabled as it interprets the code and does the transformation into the event list.
The calendar element does render the Javascript calendar from DPCalendar within the layout.
As DPCalendar is framework agnostic, it looks the same on every template. YOOtheme on the other side uses it's own CSS framework UIkit for styling it's pages. To combine both worlds, the YOOtheme Pro plugin is able to replace DPCalendar CSS classes with the ones from YOOtheme/UIkit. Actually it is able to replace any class with a replacement one.
The plugin comes out of the box with the most common replacements. But the site admin is able to add unlimited replacements, to adjust even better into the current design.
Comments (0)