Wix - How to install the Bridebook Website Widget
Choose how you want the widget to appear on your website, then follow the steps for your chosen option.
Before you start
Watch the walkthrough
4 steps to go live
Get your widget URL from Bridebook Business
Log into Bridebook Business and head to the Website Widget section. You need the URL from your embed code. Copy just the address inside the src="" part of the iframe, not the full iframe tag itself.
https://enquiry.bridebook.com?publicId=YOUR_VENUE_ID&widgetId=YOUR_WIDGET_IDJust the URL, not the iframe code
Copy everything between the quotes after src= in your embed code. Do not copy the full <iframe> tag as pasting that will cause a Forbidden error.
Open your page in the Wix editor and add an Embed element
In the Wix editor, open the page where you want the widget. Click + Add in the top left, then click Elements. Search for html in the search bar. You will see two options. Click Embed a site.
Do not use Embed code
The Embed code option creates a nested iframe which blocks external content and will show a Forbidden error. Always use Embed a site for the embedded Bridebook widget.
Paste the URL and click Apply
An HTML Element will be placed on your page and a Settings panel will open on the right. Make sure Choose what to embed is set to Link. Paste your Bridebook URL into the Link field, then click Apply. The widget will load inside the element.
Make sure you click Apply
The widget will not load until you click Apply. If you close the panel without clicking it, the element will stay blank.
Resize the element and publish
Drag the edges of the HTML element to resize it so the full Bridebook form is visible. A height of around 700px works well for most screens. When you are happy, click Publish in the top right and open your live page to confirm it is showing correctly.
What to look for
The Bridebook form loads inside the element on your page
Couples will see options to book a showround, register for an Open Day, or send an enquiry. Every submission lands in Bridebook Business tagged as Website Widget.
Still seeing a blank box?
Make sure the Settings dropdown says Link not Code, that you pasted only the URL (not the full iframe tag), and that you clicked Apply before closing the panel.
Before you start
Watch the walkthrough
How the popup works
On Wix, the script and button code both go into the same Embed code element. Wix sandboxes HTML elements so the script and button need to be together in one block to communicate. You paste both into a single element, click Apply, and the button is live.
3 steps to go live
Get your script from Bridebook Business
Log into Bridebook Business and go to the Website Widget section. Copy your unique script tag. It is a single line starting with <script, different to the iframe embed code.
<script src="https://enquiry.bridebook.com/widget.js"
data-public-id="YOUR_PUBLIC_ID"
data-widget-id="YOUR_WIDGET_ID"
defer></script>
Add an Embed code element and paste both the script and button
In the Wix editor, go to the page where you want the button. Click + Add, then Elements. Search for code and click Embed code.
In the Settings panel, make sure Choose what to embed is set to Code. Then paste the combined code below into the editor field. This includes both the script and the button together in one block. Then click Apply.
<script src="https://enquiry.bridebook.com/widget.js"
data-public-id="YOUR_PUBLIC_ID"
data-widget-id="YOUR_WIDGET_ID"
defer></script>
<button data-bb-open style="background-color:#4D52E3;
color:#fff;padding:12px 24px;border-radius:30px;
border:none;font-size:15px;font-weight:700;
cursor:pointer;">Book a viewing</button>
Why both go in the same box
Wix isolates each HTML element in its own sandbox. If the script is in a separate location from the button, they cannot communicate and the popup will not open. Keeping them together in one Embed code element solves this.
Want to match your own brand?
You can change the button colours, size, and label text to match your venue's style. The only thing you must keep is data-bb-open on the button element. Without it the popup will not open.
<button data-bb-open style="background-color:#YOUR_COLOUR;
color:#YOUR_TEXT_COLOUR;padding:12px 24px;
border-radius:8px;border:none;
font-size:15px;font-weight:700;
cursor:pointer;">Your button label</button>
Publish and test it
Click Publish in the top right of the editor. Then open your live site and click the button. The Bridebook form should open in a popup overlay on top of your page.
What to look for
The Bridebook form opens in a popup when the button is clicked
Couples can book a showround, register for an Open Day, or send an enquiry without leaving your page. Every submission lands in Bridebook Business tagged as Website Widget.
Popup not opening?
Make sure both the script and button code are in the same Embed code element, that the dropdown is set to Code, and that you clicked Apply. Check the button includes data-bb-open exactly as shown. Clear your cache and try again.
Works with
Ready to go?
Set up your widget in Bridebook Business
Get your unique code, choose your widget type, and go live. Every enquiry lands in Bridebook Business automatically, tagged by source and ready to action.
Set up your widget →