Skip to main content

Embedding Activity Calendar on External Websites

This is a quick guide on how you can embed your activity calendar on your website or any other external websites.

Siddesh Iyer avatar
Written by Siddesh Iyer
Updated today

You can easily display your activity calendar on your website by embedding it with customisable options. This guide will walk you through the process and available customisation features.

Getting Started

To embed your activity calendar, simply copy the embed code provided for your activity calendar. Once embedded, you can customise the display to match your website's design and show only the activities and facilities that are relevant to your visitors.

To get the embed code, go to 'Club Management' > 'Activity Schedule' > 'Embed this Schedule'.

Filtering Options

The embedded calendar supports advanced filtering to help you display exactly what your audience needs to see:

  • Activity Filters: Choose which specific activities appear on your embedded calendar. This allows you to showcase only relevant programs or events for different pages on your website. You can do this by searching for a specific activity (or activity series) from the 'Search activities' input.

  • Facility Filters: Select which facilities' activities should be displayed. This is particularly useful if you operate multiple locations and want to show activities from specific venues only. You can set this from the facility filter input.

Customization Features

You have several options to customise the appearance and functionality of your embedded calendar:

  • Calendar View Options: Choose the calendar display format that works best for your website layout and user experience.

  • Month Pinning: Pin the calendar to display a specific month by default. This is helpful when promoting activities for a particular time period or seasonal programs.

  • Filter Preservation: Include any filters you've already applied to your calendar view. This ensures that visitors see the same curated selection of activities that you've configured.

  • Background Colour: Set a custom background colour for the calendar to match your website's colour scheme and branding.

  • Padding Control: Adjust the spacing around the calendar to ensure it fits seamlessly within your page layout.

Did this answer your question?