alt

Add calendar to your Wix website

Option A: Wix Editor (Classic)

  • Log in to your Wix account and open your site in the Editor.

  • Go to the page where you want the calendar to appear (or create a new page).

  • Click the Add (+) button on the left side.

  • Choose Embed Code (or More) → HTML iFrame / Embed HTML.

  • A gray box will appear. Click Enter Code (or SettingsCode).

  • Paste your Bookedin iFrame code into the code field and confirm (Apply / Update).

  • Position the element where you want it and stretch it to the full page width.

  • Set a suitable height (e.g., 900–1100px) to prevent a double scrollbar from appearing.

  • Click Publish in the top right corner to take the changes live.

Option B: Wix Studio (formerly Editor X)

  • Open your site in Wix Studio.

  • Navigate to the desired page.

  • Click Add (+) on the left → Embed & SocialEmbed CodeiFrame / Custom Embed.

  • Place the Embed element on the page and click SettingsCode.

  • Paste the Bookedin iFrame code and confirm (Apply).

  • Stretch the element to 100% width and set a fixed height (start with ~900px).

  • Check the Responsive view (desktop/tablet/mobile) to ensure everything scales correctly.

  • Click Publish to take the changes live.

Handy Tips

  • HTTPS Required: Ensure the iFrame URL starts with https://; Wix blocks "mixed content" (http) for security.

  • Height & Scrolling: If you see an internal scrollbar, increase the height in the iFrame code or adjust the container height within Wix.

  • Full Width: Set the container to Stretch (100%) or set a max-width in the page grid for a clean layout.

  • Multiple Pages: Repeat the steps above for each page where you want to display the calendar.

  • Speed: The loading="lazy" attribute is fine; however, you can remove it if you want the calendar to render immediately "above the fold."

Done! Your Bookedin calendar is now on your Wix website and ready for your visitors to use.

For consultation & enrolment call today