Skip to main content

Add an embedded widget to your Wix website

Do you use Wix and want an embedded BookSpot widget on your website? Use the Wix element Custom Element and follow the steps in this article to get started.

Written by Team BookSpot

Table of contents:

Before installing the embedded widget
​Get the widget code in BookSpot
​Install the widget on Wix
​Questions & Answers

Before installing the embedded widget

Before you add an embedded BookSpot widget to your Wix website, make sure you have the following in place:

  • A Premium plan with Wix.

  • A saved widget in BookSpot of the type:

    • Embedded product calendar, or

    • Embedded widget.

Haven’t created a widget yet? Read more about how to create a widget here.

Get the widget code in BookSpot

  1. Go to Settings (in the left menu) → Widget.

  2. Open the widget you want to show on your Wix site. Click the pencil icon to edit it.

  3. Scroll to the bottom, to step 3. Add to your website, and copy the widget code.
    ​
    It looks like this: <bookspot-widget id="c224e766-a4c6-46cb-96aa-4cc41c71d106"></bookspot-widget>

Install the widget on Wix

1. Add a Custom Element

  1. Open the page in the Wix Editor where the widget should appear.

  2. Click Add Elements → Embed Code → Popular Embeds → Custom Element.

  3. Drag the element to the spot on the page where the widget should appear.

2. Set up the Custom Element

  1. Select the element and click Choose Source (button at the top).

  2. Select Server URL and enter https://bookspot.io

  3. In the Tag Name field, enter bookspot-widget

  4. Click Set Attributes (button at the top) and then Set Attribute (the blue button).

    1. Attribute name: Enter id

    2. Value: Paste the widget’s id.
      Similar to this: c2j4ed66-a4c6-46cb-96aa-4c642c71d806

  5. Click Set.

  6. Click Publish to publish the changes to the page.
    Note that the widget can’t be previewed. The change has to be published.

Once the page is published, your customers can book directly on your Wix site! 🙌

Questions & Answers

Why doesn’t the widget show in the Wix Editor or preview?

In the Editor and preview, Wix doesn’t display Custom Elements the same way as on the published page. Technically, the widget doesn’t work in the Editor or preview. Publish the page and check the widget on the published site.

Why don’t Custom Elements work on my site?

Wix requires the site to have a Premium plan and a connected domain. Also check that the Tag Name is bookspot-widget, that the Attribute name is id, and that the base script is under Custom Code.

Can I use the same widget on several pages?

Yes. Add a Custom Element with the same id on each page where the widget should appear. The base script only needs to be added once.

Why does the widget look cut off?

The Custom Element in Wix may sit in a section that limits how large the Custom Element can be. The widget adapts to the section or spot it is placed in.

Related Articles
Did this answer your question?