Note: This guide assumes that you have the Events module enabled on your Diary.
If you have followed our previous guide on setting up Events, you should have some events and news articles set up by this point. The next step is to display the events and news articles you have created on your website. You may do so by using our API with plug-and-play integrations.
To start, go to your Diary and navigate to the 'Utilities' sub-menu on the left-hand side navigation, and click the Diary API link. You will be presented with a page which allows you to customise and preview changes for each integration. There are 4 integrations that are relevant to events and news articles. These are:
Events Integration: This is the fully-fledged feed of ongoing and upcoming events. This should be shown on your events page.
Upcoming Events Integration: A minimal version of the Events Integration. This only displays the titles and dates of the ongoing and upcoming events, with links to the respective items on the events page. You could display this in your footer or sidebar.
News Articles Integration: This is the fully-fledged feed of news articles published on or before today. This should be shown on your news page.
Latest News Integration: A minimal version of the News Articles Integration. This only displays the article headings and dates with links to the respective articles on the news page. You could display this in your footer or sidebar.
Each integration comes with several configurable properties to accommodate for a seamless fit with your website. A live preview of the widget is shown on the right of the customisation panel. Use the 'Light Frame' and 'Dark Frame' buttons below the preview to change the background colour of the preview frame to add contrast for lighter / darker colours (the frame will not be shown on the live version of the widget).
Once you are satisfied with the look and feel of the widget, you are ready to add it to your website. To do so, copy the code shown in the black box under the customisation panel.
Paste the code in the relevant part of your website, i.e. the events page. Refresh your website and you should see relevant content at the position where you have placed the code block.