All Collections
General
Embedding Event Details On A Squarespace Website
Embedding Event Details On A Squarespace Website

Learn how to embed content from your Event Portal on a Squarespace website.

Updated over a week ago

If you have a website hosted on Squarespace and you wish to embed content from your Event Portal, you can follow the steps in this article to embed your content.

There are a few steps you need to take to enable this:

Step 1: Add code to your Squarespace website to enable responsive content embedding

To ensure the content you embed is responsive and can present itself in an optimized way on your Squarespace website, you must add some custom JavaScript. The purpose of this JavaScript is to ensure that the content you embed remains responsive and presents itself ideally on devices of different sizes (e.g. no scrollbars will appear around the embedded content).

To do this:

  1. Go to your Squarespace website and press the ESC key to sign in.

  2. Sign in as your website administrator.

  3. Go Home > Settings > Developer Tools > Code Injection.

  4. Copy the following script tag to your clipboard and paste it to the very end of any existing text contained in the HEADER field.

    <script src="https://cewebprodcdn.clearevent.com/Scripts/iframe-resizer/iframeResizer.min.js"></script>
  5. Click Save.

For example:

Step 2: Embed the content in a Squarespace website page

Next, we can embed the desired content into a specific Squarespace page on the website. In the steps below, we will add a new page and then embed some content (a Schedule in this example).

To do this:

  1. In ClearEvent, go to the Event Manager App > Schedules section > Schedules tab.

  2. Edit the desired Schedule you wish to embed and then go to the Sharing tab.

  3. Copy the Share Code field to your clipboard.

  4. Go back to your Squarespace website. If needed, press the ESC key to sign back into Squarespace.

  5. In Squarespace, go to Home > Pages.

  6. Click +Add Page to create a new Page where we will embed our schedule. Give the page a name (e.g. "Schedule"). Alternatively, you can edit an existing page.

  7. Click the Edit button for the default empty Content Block.

  8. Click the [+] button and add a new Code Content Block.

    Adding a Code Block to your website to display the content.
  9. In the Content window, paste the Share Code that you copied earlier to your clipboard:

    Paste the embed code into the Code Block
  10. Click the Save button.

That's it, you should now see the schedule embedded in your Squarespace website. The schedule should automatically adjust its height to ensure that the full schedule is displayed:
โ€‹

Example of an embedded ClearEvent Schedule in a Squarespace website

Still have questions?

Chat with us!

Did this answer your question?