How do I use Amelia with Elementor
Amelia integrates directly with the Elementor page builder, allowing you to add booking forms, event forms, and the Customer and Employee Panels to your pages without writing shortcodes manually.
Once you add an Amelia widget to a page, you can configure the available options directly from the widget settings, including what the form displays, preselected booking parameters, the layout version, and manual loading options.
Where can I find Amelia widgets in Elementor?
Open or create a WordPress page with Elementor and search for Amelia in the Elements panel.
The following Amelia widgets are available:
How do I configure an Amelia booking form in Elementor?
Drag the Amelia widget you want to use onto the page. When the widget is selected, its settings are displayed in the Elementor panel on the left.
The Step-By-Step Booking, Catalog Booking, Events List, and Events Calendar widgets display a skeleton preview of the form in the editor.
Depending on the selected widget, you can preselect booking parameters, choose what the form displays, select the layout version, or configure the form to load manually.
The layout displayed on the front end is determined by the layout selected in the Elementor widget settings. The Customize section is used only to customize the appearance of that layout; it does not determine which layout is displayed on the page.
How do I use Preselect Booking Parameters?
Enable Preselect Booking Parameters to control which booking options are available when the form is loaded.
Depending on the selected form, you can preselect categories, services, employees, locations, packages, or events. This allows you to create dedicated booking pages for specific services, employees, locations, or events without creating a shortcode manually.
For the Step-By-Step Booking and Catalog Booking widgets, the Show All option lets you choose whether the booking form displays both services and packages, services only, or packages only:
- Show All – displays both services and packages.
- Services – displays services only.
- Packages – displays packages only.
The Choose layout version option determines which version of the booking form is displayed on the front end. If you want to change the colors, fonts, labels, or other visual elements of the selected layout, configure them in Amelia → Customize.
How do I configure event widgets?
For the Events List and Events Calendar widgets, Preselect Booking Parameters allows you to control which events are displayed.
You can define the event time scope, select specific events, filter events by tags or locations, and choose whether recurring events should be displayed.
How do I load a booking form manually?
The Load booking form manually option allows you to load the booking form when a visitor interacts with another element on the page, such as a button or link.
Enter the ID or class of the element that should load the booking form and select the corresponding Trigger type.
Enable Show in Amelia Popup if you want the booking form to open in an Amelia popup instead of loading directly on the page.
Can I add an IvyForms form before the booking form?
Yes. If you’re also using IvyForms, Amelia’s IvyForms integration allows you to display a form before customers proceed to the booking form. This is useful when you want to collect additional information from customers before they start the booking process.
Use the Pre-booking Intake Form (IvyForms) dropdown to select one of the IvyForms forms you’ve already created.
The Pre-booking Intake Form (IvyForms) option is available only if IvyForms is installed and the Load booking form manually field is empty.
For more information about setting it up, see our IvyForms integration documentation.
Can I use Amelia shortcodes with Elementor?
Yes. Amelia widgets allow you to configure the available booking options directly through the Elementor widget settings, so you don’t need to create a shortcode manually for these configurations.
If you want to add a shortcode manually or configure shortcode parameters yourself, see the Amelia shortcodes documentation for a complete list of available shortcodes and parameters.
What happens if my setup is incomplete?
If a selected service, category, employee, location, package, or event is unavailable or the selected parameters don’t match your Amelia configuration, the booking form may not be able to load correctly.
If a parameter combination doesn't exist, for example, if an employee is not assigned to a selected service, Amelia can indicate that the configuration is incomplete but may not identify the exact element causing the issue.
If the form doesn’t load as expected, review the selected booking parameters and make sure the required services, employees, locations, packages, or events are properly configured and connected in Amelia.