Elementor 3.33.5 + Booking Calendar: booking form shows raw CSS/JS and the calendar does not load

Last updated: December 18, 2025

If your Booking Calendar form stopped loading right after updating Elementor to v3.33.5, and you now see
CSS/JavaScript printed inside the form (instead of being applied/executed), this is almost always caused by
where the shortcode was inserted.

What changed in Elementor 3.33.4 / 3.33.5 (why this happens)

Elementor 3.33.5 includes a security fix that tightens code security enforcement in the
Text Editor widget. Elementor 3.33.4 includes similar security enforcement changes.
After these updates, when you paste Booking Calendar output/shortcode into the Elementor Text Editor widget,
Elementor may sanitize, strip, or escape parts of the output.

Typical result: the

<style>

/

<script>

wrappers disappear, and the remaining CSS/JS becomes plain text in the page.
Because the JavaScript does not execute, the calendar never initializes.

Symptoms you may see

  • The calendar stays on a loading frame, or never renders interactive dates.
  • CSS appears as plain text inside the booking form.
  • JavaScript appears as text (often wrapped by
    <p>...</p>

    ).

  • In the page source, you can find the script content, but it is not inside
    <script>

    tags.

  • You may see a warning like: "You have added the same calendar (ID = X) more than once..." (this is a separate issue; see below).

Fix (recommended): do not use Elementor Text Editor for the Booking Calendar form

Option A: Use Elementor Shortcode widget (recommended)

  1. Open the page in Elementor Editor.
  2. Locate the widget where you inserted the Booking Calendar shortcode (usually Text Editor).
  3. Remove that Text Editor widget, or cut the shortcode out of it.
  4. Drag the Shortcode widget into the page.
  5. Paste your Booking Calendar shortcode into the Shortcode widget (exactly as provided by Booking Calendar).
  6. Click Update.
  7. Clear caches (plugin/server/CDN) and test the page in an incognito/private window.

This keeps the shortcode output in the correct rendering pipeline and avoids Text Editor sanitization.

Option B: Use the native Booking Calendar Elementor widget (best UX)

If you have the Booking Calendar Elementor widget available:

  1. Open the page in Elementor.
  2. Add the Booking Calendar widget.
  3. Select your booking resource/calendar, form type/template, and other options.
  4. Update the page and test.

This is the most robust method because the widget renders the booking form without relying on pasted code.

Important extra check: make sure the same calendar is not added twice

If you see a message like "You have added the same calendar (ID = X) more than once on this page",
it can also prevent correct loading (conflicting IDs, duplicate initialization, overwritten variables).

Check these common "double insert" places

  • The booking form is placed in the page content and also in a header/footer template.
  • The shortcode is inside a popup, sticky element, or a mobile/desktop duplicate section.
  • The shortcode exists in two different Elementor widgets (one hidden by responsive settings).

Keep only one instance of the same resource ID on a single page.

If you need custom styling or custom JavaScript

Because Elementor 3.33.5 tightened the Text Editor widget, do not inject scripts/styles through Text Editor.
Use one of these instead:

  • Custom CSS (Elementor Pro) for styling adjustments.
  • WordPress Appearance → Customize → Additional CSS.
  • Your theme/child-theme stylesheet, or Booking Calendar’s styling options.
  • For JavaScript: Elementor Custom Code (Pro) or a small custom plugin/snippet that enqueues a script properly.

Quick troubleshooting checklist (if it still does not load)

  1. Replace Text Editor with Shortcode widget (most important).
  2. Ensure only one calendar with the same ID exists on the page.
  3. In Elementor: go to Tools and run Regenerate CSS & Data, then clear caches.
  4. Temporarily disable optimization/minify plugins to test (JS combining can break initialization timing).
  5. Check browser console errors (press F12 and open the Console tab).

FAQ

Why did it work before the Elementor update?

Because Elementor 3.33.5 introduced stronger security enforcement in the Text Editor widget.
This can sanitize code-like output and break inline CSS/JS needed for dynamic widgets like booking calendars.

Can I keep using Text Editor if I want to format text around the shortcode?

Yes. Place your text in Text Editor widgets above/below, and put the booking form itself in a Shortcode widget
(or the Booking Calendar widget).

Should I rollback Elementor as a fix?

A rollback can help confirm the cause, but it is not a good long-term solution.
The clean fix is to change the widget used to embed the booking form.