Add a booking widget to WordPress — no plugin required

What you need

• WordPress 5.0+ (Block Editor / Gutenberg). Classic Editor instructions below.
• The ability to edit a page (any role from Editor up).
• A Google account.

Step 1 — Sign up for circleit

Go to circleit.app, sign up with Google, pick a username, set your weekly availability, create one event type. Takes about 90 seconds.

Step 2 — Add a Custom HTML block (Block Editor)

1. Edit the WordPress page where you want the widget (your Contact page is a good first home).
2. Click the + button to add a new block.
3. Search "Custom HTML" and select it.
4. Paste the snippet into the block.
5. Click Update or Publish.

The widget appears on the live page. The Block Editor's preview tab will also render the widget (most of the time), but viewing the published page is the source of truth.

If you're on the Classic Editor

1. Edit the page and switch from Visual to Text mode (the tabs at the top-right of the editor).
2. Paste the snippet anywhere in the HTML.
3. Click Update.

The Classic Editor's Visual mode will not render the widget — switch to Text mode to confirm the snippet is present, then preview the live page.

Floating button vs. inline

Default is a floating button bottom-right. For inline (calendar shows where you paste), add data-mode="inline":

<script src="https://circleit.app/embed.js"
        data-circle="your-username"
        data-mode="inline"></script>

Common WordPress gotchas

• Security plugins stripping scripts. Wordfence and some other security plugins have rules that strip <script> tags from user-edited content. If the widget doesn't load, check your security plugin's HTML/script settings and whitelist circleit.app.
• Cache plugins serving stale page. WP Rocket, W3 Total Cache, etc. After adding the snippet, clear the page cache so visitors actually receive the updated HTML.
• Theme adding "noscript" or aggressive lazy-load. Some performance themes defer all third-party scripts. If the widget shows up slowly or not at all on first load, check your theme's "Defer JavaScript" settings and exclude circleit.app/embed.js.
• Block Editor offers "WordPress will fix this code" warning.That's safe to ignore — it's a notice that Gutenberg cannot validate the embedded script, not an error.

What your customer sees

Same booking flow as on any other site: pick event → pick date → pick time → enter contact info → confirmation. The widget renders in an iframe so your WordPress theme's CSS can't accidentally style it.

Troubleshooting

• Widget doesn't render: Check Browser DevTools console (F12) — if you see "script blocked," your security plugin is the culprit.
• "Username not found": Verify data-circle matches your circleit username.
• Multiple widgets on one page: You can add as many Custom HTML blocks with different snippets as you want — each renders independently. Useful if you have different event types per landing page.