---
title: How To Integrate The OpenSpaces Widget
description: Step-by-step instructions for adding the OpenSpaces widget to your website, including script and code snippet setup.
---

[Skip to content](https://knowledgebase.clearooms.com/how-to-integrate-the-openspaces-widget#main-content)

![Colour Transparent](https://knowledgebase.clearooms.com/hs-fs/hubfs/Colour%20Transparent.png?width=1672&height=313&name=Colour%20Transparent.png)

Open main navigation

Close main navigation

- [Contact us](https://2feg9n.share-eu1.hsforms.com/2LEUbrOfJTIe01qcEQusU5w)

[Contact us](https://2feg9n.share-eu1.hsforms.com/2LEUbrOfJTIe01qcEQusU5w)

 How can we help you?

- There are no suggestions because the search field is empty.

1. [Knowledge Base](https://knowledgebase.clearooms.com/?hsLang=en-gb)
2. [OpenSpaces](https://knowledgebase.clearooms.com/openspaces?hsLang=en-gb)

# How To Integrate The OpenSpaces Widget

## Instructions for adding the OpenSpaces widget to your website

To integrate the OpenSpaces widget, you need to include **two pieces of code** on your website: a script tag and a configuration snippet.

### **Script Tag (Required)**

The widget script tag is essential for the widget to function on your website. Add this script to your site's HTML, it loads all the necessary widget functionality and should be included on any page where you want the widget to appear.

```
<script  type="module"  defer  src="https://assets.clearooms.com/openspaces/openspaces.min.js"><\/script>
```

> **Note:** This script loads the core OpenSpaces functionality. It must be included before the configuration snippet.

### **Code Snippet**

Once the script is loaded, you'll need to initialize the widget with your specific configuration. You can generate this code snippet directly from the Widgets page in your dashboard. The snippet contains your unique settings and tells the widget how to display and behave on your site.

> **Note: ** The snippet contains your settings and tells the widget how to display and behave on your site.

### **Need More Details?**

For a full guide on creating and managing your OpenSpaces widgets.   
**[Click Here.](https://knowledgebase.clearooms.com/openspaces-widgets?hsLang=en-gb)**

- [FAQs](https://knowledgebase.clearooms.com/faqs?hsLang=en-gb#main-content)

    - [General](https://knowledgebase.clearooms.com/faqs?hsLang=en-gb#general)
    - [Hosting & Security](https://knowledgebase.clearooms.com/faqs?hsLang=en-gb#hosting-security)
    - [Desk Booking](https://knowledgebase.clearooms.com/faqs?hsLang=en-gb#desk-booking)
    - [Meeting Rooms](https://knowledgebase.clearooms.com/faqs?hsLang=en-gb#meeting-rooms)
- [Getting started](https://knowledgebase.clearooms.com/getting-started?hsLang=en-gb)
- [General](https://knowledgebase.clearooms.com/general?hsLang=en-gb#main-content)

    - [Troubleshooting](https://knowledgebase.clearooms.com/general?hsLang=en-gb#troubleshooting)
    - [Desks](https://knowledgebase.clearooms.com/general?hsLang=en-gb#desks)
    - [Meeting Rooms](https://knowledgebase.clearooms.com/general?hsLang=en-gb#meeting-rooms)
    - [Admin Settings](https://knowledgebase.clearooms.com/general?hsLang=en-gb#admin-settings)
    - [Planning](https://knowledgebase.clearooms.com/general?hsLang=en-gb#planning)
- [Reports](https://knowledgebase.clearooms.com/reports?hsLang=en-gb)
- [Settings](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#main-content)

    - [Users](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#users)
    - [Desk Settings](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#desk-settings)
    - [Meeting Room Settings](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#meeting-room-settings)
    - [Room Display App Settings](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#room-display-app-settings)
    - [Services](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#services)
    - [Account Settings](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#account-settings)
    - [Event Management](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#event-management)
    - [Visitor Management](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#visitor-management)
    - [Custom Fields](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#custom-fields)
    - [Multi-Factor authentication](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#multi-factor-authentication)
    - [Manager Settings](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#manager-settings)
    - [Billing](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#billing)
    - [Status](https://knowledgebase.clearooms.com/settings?hsLang=en-gb#status)
- [Support](https://knowledgebase.clearooms.com/support?hsLang=en-gb)
- [Security](https://knowledgebase.clearooms.com/security?hsLang=en-gb#main-content)

    - [SSO, SCIM Apps & Integrations](https://knowledgebase.clearooms.com/security?hsLang=en-gb#sso-scim-apps-integrations)
    - [Privacy](https://knowledgebase.clearooms.com/security?hsLang=en-gb#privacy)
- [Desk Booking App](https://knowledgebase.clearooms.com/desk-booking-app?hsLang=en-gb)
- [Room Display App](https://knowledgebase.clearooms.com/room-display-app?hsLang=en-gb)
- [Video Tutorials](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#main-content)

    - [Getting Started With Clearooms](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#getting-started-with-clearooms)
    - [Clearooms Desk Booking App: Getting Started With Clearooms](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#clearooms-desk-booking-app-getting-started-with-clearooms)
    - [Desks](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#desks)
    - [Meeting Rooms](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#meeting-rooms)
    - [Smart Booking And Favourites](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#smart-booking-and-favourites)
    - [Clearooms Room Display App](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#clearooms-room-display-app)
    - [Apps And Integrations](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#apps-and-integrations)
    - [Users](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#users)
    - [Office Plan](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#office-plan)
    - [Desk Neighbourhoods & Meeting Zones](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#desk-neighbourhoods-meeting-zones)
    - [My Bookings](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#my-bookings)
    - [Services](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#services)
    - [Kiosk](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#kiosk)
    - [Custom Fields](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#custom-fields)
    - [Who's In](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#whos-in)
    - [Status](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#status)
    - [Help Centre](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#help-centre)
    - [OpenSpaces](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#openspaces)
    - [Parking Spaces](https://knowledgebase.clearooms.com/video-tutorials?hsLang=en-gb#parking-spaces)
- [OpenSpaces](https://knowledgebase.clearooms.com/openspaces?hsLang=en-gb)
- [Parking Spaces](https://knowledgebase.clearooms.com/parking-spaces?hsLang=en-gb#main-content)

    - [Parking Misuse Reporting](https://knowledgebase.clearooms.com/parking-spaces?hsLang=en-gb#parking-misuse-reporting)

[![Colour Transparent](https://knowledgebase.clearooms.com/hs-fs/hubfs/Colour%20Transparent.png?width=1672&height=313&name=Colour%20Transparent.png "Colour Transparent")](http://clearooms.com)

<https://www.facebook.com/Clearooms> <https://www.linkedin.com/company/clearoomsapp/> [mailto:support@email.com](mailto:support@email.com)

Copyright © 2025, clearooms.com