Skip to main content

Embedding WellnessLiving Widgets on Your Website

Updated over a week ago

Embedding WellnessLiving widgets on your website or Facebook page lets your clients interact with your business—view schedules, book services, buy passes, complete lead forms, and more—without leaving your site.

You can embed the following widgets:

How Widgets Display

Widget Type

How It Appears

Where Code Goes

Standard Widgets

Inline on a specific page section (embedded in your site’s content)

Code snippet placed directly on the page

CAASI AI Agent

Floating chat-style launcher across your entire site

Code placed once in site header or footer

CAASI does not appear inside a page. It loads globally, like a chat bubble.

Key tips before you begin

  1. Use HTTPS
    Make sure your website starts with https:// so the widget loads securely.

  2. Test on desktop + mobile
    Every website builder behaves differently. Always preview after embedding.

  3. Confirm proper display
    If something looks off, check that your domain is correctly added in WellnessLiving.

Step 1 — Allow Widgets on Your Website

You must tell WellnessLiving which domains are allowed to display your widgets.

To allow widgets:

  1. Open App Drawer → Setup → Web Applications → Client View Settings.

  2. Scroll to Website Integration Settings.

  3. Under Website Address, enter your website domain.

    • Example: www.yourbusiness.com

  4. For multiple sites, separate with commas.

    • Example: myfitnessstudio.com, myothersite.net

  5. For subdomains, use an asterisk:

    • Example: *.yourbusiness.com

  6. Click Save.

Step 2 — Copy the Widget Code

For Standard Widgets

  1. Open App Drawer → View All → Setup → Website Widgets.

  2. Select the widget type you want to embed.

  3. If using Custom Schedule or Lead Capture, choose your custom widget → Embed code.

  4. (Optional) Choose your Location.

  5. (Optional) Enter the URL of the page where the widget will be placed.

  6. Enter your Website domains (comma-separated).

  7. Copy the code from Widget code or Script.

For CAASI AI Agent

  1. Open App Drawer → View All → CAASI.

  2. Click Open CAASI Communication Hub.

  3. Go to Application Settings → Channel Settings → Webchat.

  4. Click Deploy.

  5. Copy the provided script.

Step 3 — Embed the Code in Your Website Builder

Below are instructions for the most common builders.
If your builder isn’t listed, look for HTML, Custom Code, or Embed blocks.

WordPress

For standard widgets

Standard widgets include the Custom Schedule, Standard Schedule, Lead Capture, FitBUILDER, Review, Appointment, Book-a-spot, Event, Store, and Staff widgets.

To add widget code for a standard widget to a WordPress site:

  1. Edit the page or post where you want the widget to appear.
    ​

  2. Click the + button and add a Custom HTML block.
    ​

  3. Paste your iframe embed code inside the block.
    ​

  4. Click Preview to see the widget.
    ​

  5. Click Update or Publish to make it live.

➡️ Official guide: Embed content in WordPress
​

For CAASI

To add widget code for CAASI to a WordPress site:

  1. Open WordPress and click Appearance > Theme File Editor.
    ​

  2. In the list, click footer.php.
    ​

  3. Paste the widget code after </body>.
    ​

  4. Click Update File, then open your webpage to confirm that CAASI appears on all pages.
    ​

Shopify

For standard widgets

Standard widgets include the Custom Schedule, Standard Schedule, Lead Capture, FitBUILDER, Review, Appointment, Book-a-spot, Event, Store, and Staff widgets.

To add widget code for a standard widget to a Shopify site:

  1. From your Shopify admin, go to Online Store > Pages.
    ​

  2. Edit the page you want to update or create a new one.
    ​

  3. Switch to HTML view (click the <> icon).
    ​

  4. Paste your iframe code.
    ​

  5. Click Save and preview your page.

➡️ Official guide: Embed code in Shopify

For CAASI

To add widget code for CAASI to a Shopify site:

  1. From your Shopify admin, go to Online Store > Themes.
    ​

  2. Click Customize.
    ​

  3. Click Theme settings.
    ​

  4. Click Custom CSS.
    ​

  5. Paste in your widget code.
    ​

  6. Click Save.

Wix

For standard widgets

Standard widgets include the Custom Schedule, Standard Schedule, Lead Capture, FitBUILDER, Review, Appointment, Book-a-spot, Event, Store, and Staff widgets.

To add widget code for a standard widget to a Wix site:

  1. Open the Wix Editor and navigate to the page where you want to add the widget.
    ​

  2. Click Add (+) > Embed > Embed a Widget.
    ​

  3. Paste your iframe code in the code box.
    ​

  4. Resize the box to at least 1050px tall.
    ​

  5. Click Publish.

➡️ Official guide: Adding an HTML iframe to Wix
​

For CAASI

To add widget code for CAASI to a Wix site:

  1. Open Wix and click Settings > Custom Code.
    ​

  2. Select Add Code to All Pages.
    ​

  3. Under Body End or All Pages Footer, paste the widget code.
    ​

  4. Save your changes, then open your webpage to confirm that CAASI appears on all pages.
    ​

Squarespace

For standard widgets

Standard widgets include the Custom Schedule, Standard Schedule, Lead Capture, FitBUILDER, Review, Appointment, Book-a-spot, Event, Store, and Staff widgets.

To add widget code for a standard widget to a Squarespace site:

  1. Edit the page and click an insert point to add a Code Block.
    ​

  2. Paste your iframe code into the block.
    ​

  3. Click Apply, then Save the page.
    ​

  4. View your site to confirm the widget appears correctly.

➡️ Official guide: Add code using Code Blocks in Squarespace
​

For CAASI

To add widget code for CAASI to a Squarespace site:

  1. Open Squarespace and click Settings > Advanced > Code Injection.
    ​

  2. In the Footer section, paste the widget code.
    ​

  3. Save your changes, then open your webpage to confirm that CAASI appears on all pages.

GoDaddy Website Builder

To add your widget code to a GoDaddy site:

  1. Go to your GoDaddy Website Builder and open your site editor.
    ​

  2. Click Add Section and choose HTML.
    ​

  3. Paste your iframe code into the HTML box.
    ​

  4. Click Done, then Publish your site.

➡️ Official guide: Add HTML or custom code to GoDaddy
​

Embedding a Widget as a Button

The following widgets can be opened from a button instead of being embedded inline:

  • Lead Capture

  • Review

  • Appointment

  • Book-a-spot

  • Store

  • Staff

To embed a widget button:

  1. Go to App Drawer → View All → Setup → Website Widgets.

  2. Select the widget.

  3. (If Lead Capture) choose your custom widget → Embed code.

  4. Choose the Location (if applicable).

  5. Enter Website domains.

  6. Copy the code from Link code.

  7. Paste it into your website’s HTML where you want the button to appear.

  8. Save and confirm the button opens the widget correctly.

Embedding a Widget on Your Facebook Page

Supported widgets: Standard Schedule, Lead Capture, Review, Appointment, Event, Store
​Requirement: Your Facebook Page must have 2,000+ likes.

To embed:

  1. Open App Drawer → Setup → Website Widgets.

  2. Select your widget type.

  3. (If Lead Capture) select your custom widget → Embed code.

  4. Choose the Location (if applicable).

  5. Click Add to Facebook Page.

  6. Log in to Facebook.

  7. Select your Page → click Add Page Tab.

  8. Check your Page sidebar to confirm the widget tab appears.

Troubleshooting Widget Embeds

If your widget isn’t showing or isn’t working the way you expect, use the steps below to quickly identify and fix the issue.

1. The widget is not appearing on my website

Most common causes

  • Your website domain was not added in WellnessLiving.

  • Your site is missing https:// (secure connection).

  • The code was placed in the wrong area of your site builder.

How to fix it

  1. Go to App Drawer → Setup → Web Applications → Client View Settings.

  2. Under Website Integration Settings, confirm your domain is listed.

  3. Make sure your website uses https:// (talk to your website host if unsure).

  4. Re-embed the code in an HTML, Embed, or Custom Code block.

  5. Clear your browser cache and refresh the page.

2. The widget loads, but it looks cut off or too small

Most common cause

Your website builder’s container is too short or not auto-resizing.

How to fix it

  1. Increase the widget container height to at least 1050px.

  2. For Wix: manually resize the embed box taller.

  3. For Squarespace: set the Code Block to “Display in iframe” if available.

  4. Preview on mobile and desktop.

3. The widget loads on desktop but not on mobile

Most common causes

  • Your site builder is hiding embedded HTML on mobile layouts.

  • Your theme has separate mobile templates.

How to fix it

  1. Check your mobile editor view (Wix, GoDaddy, Squarespace).

  2. Confirm the embedded HTML section is not hidden on mobile.

  3. Save and republish your site.

4. CAASI is not showing up on all pages

Most common causes

  • CAASI code was added only to a single page, not the global header/footer.

  • The code was placed inside the page content instead of the theme layout.

How to fix it

  1. Move the CAASI script to your site’s Footer, Body End, or Theme Settings (global area).

  2. Republish your site.

  3. Clear your browser cache.

5. The widget displays, but the information is incorrect

Most common causes

  • The wrong Location was selected when copying the embed code.

  • The widget was customized for a different page URL or domain.

How to fix it

  1. Return to Website Widgets.

  2. Select the correct Location.

  3. Re-copy the code.

  4. Paste the updated code into your website and save.

6. The widget button doesn’t open anything

Most common causes

  • You embedded the wrong type of code.

  • Link code was pasted into a non-HTML area.

  • The website domain is missing in Client View Settings.

How to fix it

  1. Go back to the widget setup page.

  2. Confirm you copied Link code, not iframe or script code.

  3. Paste it into an HTML, Button HTML, or Custom Code block.

  4. Ensure your domain is added under Website Integration Settings.

7. I get an error message that the widget is “not allowed on this domain”

Cause

Your website domain or subdomain wasn’t added in WellnessLiving.

How to fix it

  1. Add your domain under
    ​Setup → Web Applications → Client View Settings → Website Integration Settings.

  2. For subdomains, add a wildcard:

    • Example: *.yourbusiness.com

  3. Save and refresh your website.

8. The widget loads slowly or times out

Most common causes

  • Browser caching issue

  • Conflicts with other scripts on your site

  • Network firewall at your location

How to fix it

  1. Refresh the page with Ctrl + F5 (Windows) or Cmd + Shift + R (Mac).

  2. Try loading the page in a private/incognito window.

  3. Disable other scripts or pop-up blockers temporarily.

  4. Test on a different internet connection.

9. Facebook is not letting me embed the widget

Most common causes

  • Your Facebook Page has fewer than 2,000 likes

  • Facebook’s platform is blocking third-party tabs

  • You're using a personal profile instead of a Page

How to fix it

  1. Confirm you are embedding the widget into a Facebook Page (not a profile).

  2. Make sure your Page has 2,000+ likes.

  3. Try again using a desktop web browser (mobile may block the flow).

10. I embedded the code, but nothing changed on my website

Most common causes

  • Changes were saved but the site was not published

  • Browser is showing a cached version of the page

  • Code was added to a draft or unpublished section

How to fix it

  1. Click Publish or Update in your website builder.

  2. Open the page in an incognito/private window.

  3. Verify the code was added to the active page—not a template, header banner, or draft.

Related Articles
Lead Capture Widget
Share a Custom Schedule Widget link
Customize the FitBUILDER Widget
Widget settings
Complete Guide to CAASI, Your AI Agent
Did this answer your question?