Skip to main content

Embedding on Your Website

Once your widget is configured, you need to add it to your website so customers can find it. This guide covers the two main approaches — iframe embedding and direct linking — with specific instructions for popular website builders.

Two Ways to Add the Widget​

MethodBest ForHow It Works
Iframe Embed (Option A)Showing the widget directly on your website pageThe widget loads inside your page, so customers never leave your site
Direct Link (Option B)Linking to the widget from a button or menu itemCustomers click a link and the widget opens in a new tab or window

Both methods connect to the same widget and produce the same bookings. Choose whichever fits your website best.

  1. Go to Settings > Booking widget.
  2. Scroll down to the Embed options section.
  3. Select the tab for the widget type you want — Rentals, Experiences, or Store.
  4. Under Option A, copy the iframe embed code using the Copy code button.
  5. Under Option B, copy the direct link using the Copy link button.

The Embed options section with Option A iframe code and Option B direct link

The iframe code looks something like this:

<iframe src="https://app.equipdash.com/widget/123/rentals" width="100%" height="800" frameborder="0"></iframe>

The direct link looks like:

https://app.equipdash.com/widget/123/rentals

Embedding with an Iframe​

General Instructions​

These steps work for any website where you can add custom HTML.

  1. Copy the iframe embed code from the Embed options section.
  2. Open the page on your website where you want the widget to appear (e.g., your "Book Now" page).
  3. Switch to the HTML editor or add a Custom HTML block.
  4. Paste the iframe code.
  5. Save and publish the page.

Adjusting the height: The default height is 800 pixels. If your product list is longer or shorter, you can change this value. For example, height="1000" gives more room for larger catalogs.

WordPress​

  1. Log in to your WordPress dashboard.
  2. Navigate to the page where you want to add the widget (or create a new page).
  3. Click the + button to add a new block.
  4. Search for Custom HTML and add it.
  5. Paste your iframe embed code into the HTML block.
  6. Click Preview to check it looks right.
  7. Click Publish or Update to save.

If you are using the classic WordPress editor, switch to the Text tab and paste the iframe code there.

Squarespace​

  1. Log in to your Squarespace site editor.
  2. Navigate to the page where you want the widget.
  3. Click Edit on the page.
  4. Click a + button to add a new block.
  5. Choose Code from the block options.
  6. Paste your iframe embed code.
  7. Make sure the Display Source toggle is turned off.
  8. Click Apply, then Save the page.

Wix​

  1. Log in to your Wix site editor.
  2. Navigate to the page where you want the widget.
  3. Click the + (Add) button in the left toolbar.
  4. Select Embed Code > Embed HTML.
  5. A box appears on the page. Click Enter Code.
  6. Paste your iframe embed code.
  7. Click Update.
  8. Resize the embed box to fit the widget (aim for full width and at least 800px height).
  9. Click Publish.

Other Website Builders​

Most website builders support custom HTML or embed blocks. The process is similar:

  1. Find the "Custom HTML," "Embed," or "Code" block in your builder.
  2. Paste the iframe code.
  3. Save and publish.

If your builder does not support iframes, use the Direct Link method below instead.

If you prefer not to embed the widget or your website builder does not support iframes, you can link to the widget instead.

  1. Copy the Direct Link from the Embed options section (Option B).
  2. On your website, create a button or menu item (e.g., "Book Now").
  3. Set the link URL to the direct link you copied.
  4. Optionally, set the link to open in a new tab so customers can return to your site easily.

Embedding Individual Products or Experiences​

You can also embed a single product or experience directly, rather than the full catalog. This is useful if you want to feature a specific item on a landing page.

The embed URLs follow this pattern:

  • Single product: https://app.equipdash.com/widget/{supplier-id}/rentals/product/{product-id}/embed
  • Single experience: https://app.equipdash.com/widget/{supplier-id}/experiences/{experience-id}/embed

Contact support if you need help finding these URLs for your specific items.

Tips for a Good Embed​

  • Use full width — Set width="100%" so the widget stretches to fill the available space on your page.
  • Set enough height — Start with 800 pixels and increase if your catalog is large. Customers should not have to scroll excessively inside the iframe.
  • Place it prominently — Put the widget on a page that is easy to find, like "Book Now" or "Rentals," and link to it from your navigation menu.
  • Match your colors — Configure the widget colors in Settings > Booking widget so it blends with your website design.
  • Test on mobile — Check that the widget looks good on phones and tablets. It is fully responsive, but the surrounding page layout matters too.