Embed Teamup Calendar in a Webpage

It is easy to embed a Teamup Calendar into any Web site or Facebook page.  With an embedded calendar, you can make your shared Teamup Calendar available under your existing personal or business brand. Doing so can be an advantage for several reasons:

  • The embedded calendar can correspond to an existing web presence.
  • You can assign an easy-to-remember web address to an embedded calendar.
  • You can reach a wider audience.
  • You can keep your personal or business branding consistent.

How to embed a Teamup calendar

To embed a Teamup Calendar into your website, you’ll be using the iframe tag.  Typically, it is best to embed a read-only version of your calendar onto your public website. This helps maintain the security of your calendar. Only use a modify or add-only version of your calendar if you want your users to be able to add or modify events to the embedded calendar.

Step 1.  Have your calendar link ready

From your calendar, go to Settings > Sharing. Note: you need to have a calendar administrator link to access the Settings. Create a read-only link. Customize it, if you would like, to share only selected sub-calendars.

Alternately, you can use an existing link. Most calendars have a Reader link (pre-configured in Settings) which displays all sub-calendars at a read-only permission. You can use the pre-configured link or another one which contains the sub-calendars at an appropriate permission level for public access.

Step 2.  Generate the embed code

Go to teamup.com/embed. Copy and paste the link from step 1. Here you have many options to customize how you want the embedded calendar to look like. Once you are done, copy the embed code from the button in the top left.

Step 3.  Insert the iframe code to your website

On your website, access the html editor in your website’s content management system. Most content management systems allow you to access the html editor when you are creating or editing a new post or page. If you are unsure how to do this, talk to your website administrator for help.

In the html editor, insert the iframe code. The result should look like this:

Leave A Comment?