Skip to main content

Embed a floor plan in your page

In order to embed a chart in your website, you will need to:

  1. Insert one of following scripts in your HTML page (for instance inside <head>) based on your account region:

    • Europe:
      <script src=""></script>
    • North America:
      <script src=""></script>
    • South America:
      <script src=""></script>
    • Oceania:
      <script src=""></script>
  2. Add an empty element to your page to act as a container for the embed, for instance:

    <div id="chart"></div>
  3. Add the following snippet at the end of the HTML page:

    new seatsio.SeatingChart({
    divId: 'chart',
    workspaceKey: 'PUBLIC_WORKSPACE_KEY',
    event: 'EVENT_KEY'


    • PUBLIC_WORKSPACE_KEY is your public workspace key, found at your accounts Workspace Settings.
    • EVENT_KEY is the floor plans event you want to display.

And that's it! This is the shortest path to embed a chart, but based on your needs, you will want to configure several additional settings and even insert the chart using different methods.

Below you will find a live example of this.

Client-side libraries

To make client-side integration easier, we've developed wrapper libraries for a number of popular frameworks and tools:

TypeScript types are available here: