Embed a schedule on a website
After publishing a schedule, use the Share modal to generate embed code. Set the locale and title visibility, then choose automatic height or a fixed-size iframe for your page.
Before you begin
- Sign in to a ScheduleBuilder account and publish the schedule before generating embed code
- Use a page editor or HTML area that accepts an iframe and, for automatic height, a script tag
- Decide whether the schedule title should be visible and whether the layout needs automatic or fixed dimensions
- 1
Publish the schedule
Open Share for the schedule and publish it if needed. The embed uses the public token created by publishing, so an unpublished schedule cannot be embedded.
- 2
Open the embed options
In the Share modal, open the embed section. It generates code for the current published schedule and lets you configure how it appears on your site.
- 3
Set locale and title visibility
Choose the locale for the embedded interface and decide whether to show the schedule title. These settings are included in the generated embed code.
- 4
Use automatic height for responsive content
Choose automatic height when the iframe should grow or shrink to fit its content. Copy the complete snippet: it includes both the iframe and embed.js. The script is required for automatic height to work.
- 5
Or use a fixed-width, fixed-height iframe
Choose fixed dimensions when your page reserves a specific amount of space. Set the width and height, then copy the generated iframe. This option needs only the iframe, not embed.js.
- 6
Paste and test the code
Add the generated code to your site, then preview or publish the page. Check the locale, title setting, width, and height on desktop and mobile screens.
Next steps
Test the embed in its final page layout. If your site uses WordPress, use the Schedule Builder Online plugin and shortcode instead.