Back to Troubleshooting Guides

Defer Loading the Booking Calendar

Introduction

By default, the SSA booking calendar loads immediately when the page loads – even if it’s below the fold and the visitor hasn’t scrolled to it yet. The `defer` parameter delays that load until the calendar is actually visible on screen.

This improves page load performance, especially on pages where the booking form is lower down or where multiple calendar instances exist.

Enabling Defer Loading

Shortcode

To enable deferred loading via shortcode, add the `defer` attribute with a value of 1 to your existing booking calendar shortcode:

[ssa_booking defer=1]

By default, defer loading is off. Adding `defer=1` tells SSA to wait until the calendar is scrolled into view before initializing it – instead of loading it with the rest of the page.

You can combine `defer` with other shortcode attributes. For example, to defer a specific appointment type:

[ssa_booking type="your-appointment-type-slug" defer=1]

Or with multiple appointment types:

[ssa_booking types="slug-1,slug-2" defer=1]

The `defer` attribute works with any valid booking calendar shortcode – just append `defer=1` alongside your existing attributes.

Gutenberg Block

  1. Select the Simply Schedule Appointments block in the editor
  2. Open the block settings panel on the right
  3. In the Performance settings, enable Defer Loading

Elementor Appointment Module

  1. Edit your page in Elementor
  2. Click the SSA Appointment Module
  3. In the Performance settings, enable Defer Loading
Defer Setting in the Elementor Module

Beaver Builder Block

  1. Edit your page in Beaver Builder
  2. Open the SSA Appointment Module settings
  3. In the Performance settings, enable Defer Loading

Gravity Forms – Appointment Field

  1. Open your form in Gravity Forms
  2. Click the SSA Appointment field
  3. In the field settings, under Appearance, enable Defer Loading under Performance.
Defer Setting in the Gravity Forms Appointment Module
Defer Setting in the Gravity Forms Appointment Module

Formidable Forms – Appointment Field

  1. Edit your form in Formidable Forms
  2. Click the SSA Appointment field
  3. In the field settings, under Performance, enable Defer Loading.
Defer Setting in the Formidable Forms Appointment Module
Defer Setting in the Formidable Forms Appointment Module

When to Use Defer Loading

Use defer loading when:

  • The booking calendar appears below the fold
  • The page has other heavy content that loads above the calendar
  • You’re seeing slow page load scores and the calendar is a contributing factor
  • Multiple calendars appear on the same page

You generally don’t need deferred loading when the calendar is the primary above-the-fold content (e.g., a dedicated booking page where the calendar is the first thing visitors see).

Still stuck?

File a support ticket with our five-star support team to get more help.

File a ticket

  • This field is for validation purposes and should be left unchanged.
  • Please provide any information that will be helpful in helping you get your issue fixed. What have you tried already? What results did you expect? What did you get instead?

Related Guides