All integrations
Under 5 minutes

SitStay on Squarespace

Add a Code Block, paste the snippet, and your clients can book classes right on your Squarespace site.

Squarespace is a popular choice for dog trainers who want a polished website without managing hosting. Adding the SitStay widget takes one Code Block and two values from your dashboard. Your class schedule, booking flow, and payments appear inline — no redirects, no iframes.

Step by step

  1. 1

    Open the page editor

    In your Squarespace dashboard, navigate to the page where you want the booking widget. Click Edit on that page to open the page editor.

  2. 2

    Add a Code Block

    Click an insert point (+) on the page, then select Code from the block menu. This opens the code editor.

    Code Blocks require a Squarespace Business plan or higher. Personal plans do not support custom code injection.

  3. 3

    Paste the embed snippet

    Copy the snippet below and paste it into the Code Block. Replace YOUR_TRAINER_ID and YOUR_WIDGET_KEY with the values from your SitStay dashboard (Embed Code page).

    <div id="sitstay-widget-container"
         data-trainer-id="YOUR_TRAINER_ID"
         data-widget-key="YOUR_WIDGET_KEY"></div>
    <script src="https://app.sitstayschedule.com/widget.min.js" async></script>
  4. 4

    Disable the "Display Source" toggle

    In the Code Block settings, make sure "Display Source" is turned off. This renders the widget instead of showing the raw HTML.

  5. 5

    Save and publish

    Click Save, then publish your page. Visit the page to verify the widget loads with your class schedule.

  6. 6

    Customize colors (optional)

    Add data attributes to the container div to match your Squarespace site's design. The widget also inherits theme settings from your SitStay dashboard automatically.

    <div id="sitstay-widget-container"
         data-trainer-id="YOUR_TRAINER_ID"
         data-widget-key="YOUR_WIDGET_KEY"
         data-primary-color="#2563EB"
         data-mode="dark"
         data-corner-radius="8px"></div>
    <script src="https://app.sitstayschedule.com/widget.min.js" async></script>

Things to know

  • ⚠️ Code Blocks require a Business plan or higher. Personal plans cannot embed custom code.
  • ⚠️ Make sure "Display Source" is OFF in the Code Block — otherwise you'll see raw HTML instead of the widget.
  • ⚠️ If you use Squarespace's built-in page caching, changes may take a few minutes to appear. Try an incognito window to verify.

Test your embed

Common questions

Which Squarespace plan do I need?
Code Blocks require a Business plan ($33/mo) or any Commerce plan. The Personal plan does not support custom code injection.
Can I add the widget to multiple pages?
Yes. Add a Code Block with the snippet to each page where you want the widget. The widget is designed to appear once per page.
Will the widget match my Squarespace template?
The widget renders in its own container and adapts to the available width. You can set colors and fonts via data attributes or in your SitStay dashboard to match your template.
Can I use Code Injection instead of a Code Block?
We recommend Code Blocks because they place the widget exactly where you want it on the page. Code Injection (in Settings → Advanced) injects into the header/footer, which gives less control over placement.

Ready to add bookings to your Squarespace site?

Set up your school, connect Stripe, and publish your first class in one afternoon.

7 days free · No credit card · Cancel anytime