Docs›Getting started

How to Add a Booking Widget to Wix

2 min read

A Wix booking widget lets guests check availability and book without leaving your site, and without paying anyone a commission. Mangobeds gives you the widget as a single <script> snippet, which goes into a Wix Embed HTML element.

The widget also carries the AI booking assistant, so visitors who are not ready to book can ask about dates, prices and house rules and leave you a booking lead instead of leaving the page.

Step 1: Copy your embed code

  • Navigate to Booking Forms: In your Mangobeds dashboard, go to the Forms section.
  • Select Your Booking Form: Choose the booking form you want to embed.
  • Copy the Embed Code: Click on the Insert in my web button. This copies the full Mangobeds widget code, a small <script> snippet, to your clipboard.
  • Paste the Code on Your Website: Insert this snippet into the HTML of your website where you want the booking form to appear. The widget loads the form, resizes it automatically, and enables the AI booking assistant chat. The snippet looks like this:

<script async data-form-id="BOOKINGFORMID" src="https://www.mangobeds.com/js/widget/booking-form.js"></script>

Important: do not embed the booking form as a bare <iframe> on its own. If you copy only the iframe (for example <iframe src="https://www.mangobeds.com/booking-forms/..."></iframe>), the form may still appear, but the widget features will not work: the AI booking assistant chat will not load, and the form will not resize correctly on your page. Always paste the full <script> widget code shown above so these features load.

Step 2: Paste it into Wix

  1. In the Wix Editor, click Add (+) → Embed Code → Embed HTML.
  2. Choose Code and paste the full <script> widget code, then position and resize the element on the page.
  3. Click Publish.
  4. If the form still doesn’t display, paste the widget code inside the page body, between the <body> tags, e.g. <body><script async data-form-id="BOOKINGFORMID" src="https://www.mangobeds.com/js/widget/booking-form.js"></script></body>

If the form does not appear

Check three things, in this order. First, that you pasted the full <script> snippet and not a bare <iframe>. Second, that the block you pasted into accepts raw HTML rather than escaping it. Third, that you are looking at the published site: Wix often does not run embedded scripts inside its own editor preview.

Still stuck? Email us and we will add it to your site for you, free.

This guide covers Wix only. For the other builders, the link-only option and the tips that actually turn visitors into bookings, see Getting bookings from your website with Mangobeds.