Amelia Shortcodes and Front-end Implementation
Date: November 5th, 2021
At the moment, the plugin has integration with Elementor and Divi builder, but we plan to add a lot more in the future. Adding specific (multiple) employees, categories, services, or locations through shortcodes is not possible (for example [ameliabooking services=1, 2, 3] is not possible).
Amelia's booking forms and panels can be added to pages using:
1. Gutenberg blocks:
On the right-hand side, there's a slider that you can enable "Preselect Booking Parameters" where you would be able to filter the available services, categories, employees, locations, and whether you're going to display only services, or only packages, or all:
2. Elementor widgets:
When you select the form, you'll be able to select booking parameters, just like in the Gutenberg editor:
3. Divi modules:
When you select the form, you'll be able to select booking parameters, like in Gutenberg and Elementor:
4. Shortcodes. Below is the list of shortcodes available in Amelia:
For Step-by-Step Booking Wizard view:
- [ameliabooking] if you want to show the basic Step-by-step Booking wizard,
- [ameliabooking category=1] if you want to show only the services from a category with ID 1,
- [ameliabooking service=1] if you want to show the booking form for the service with ID 1.
- [ameliabooking employee=1] if you want to show the booking form for the employee with ID 1,
- [ameliabooking location=1] if you want to show the booking form for the location with ID 1,
- [ameliabooking category=1 employee=1] if you want to show only the services from a category with ID 1 that are assigned to the employee with ID 1,
- [ameliabooking category=1 location=1] if you want to show only the services from a category with ID 1 that are provided on the location with ID,
- [ameliabooking show=services] if you have Packages enabled, but you only want to show services in the form,
- [ameliabooking show=packages] if you have Packages enabled, and you only want to show packages, without services in the form.
- [ameliabooking trigger=custom-id] if you're adding Amelia in the Elementor popup (explained in detail in the "Using Amelia in Elementor Popup" article), you need to add the button ID (class) to the button that triggers the popup, and then define it using "trigger=the-custom-id-of-your-button". "custom-id" is just an example, but you can add any ID you want, so if you add "my-button", the shortcode would be [ameliabooking trigger=my-button].
Please note: Service Description will not be displayed in [ameliabooking] form (it is only available in [ameliacatalog] form), nor will you be able to see the Category selection drop-down in this form
For the Service Catalog view:
- [ameliacatalog] if you want to show the basic Service Catalog view,
- [ameliacatalog category=1] if you want to show only the services from a category with ID 1,
- [ameliacatalog service=1] if you want to show this form for the service with ID 1,
- [ameliacatalog employee=1] if you want to show the services of one specific employee with ID 1,
- [ameliacatalog location=1] if you want to show the services of one specific location with ID 1,
- [ameliacatalog category=1 employee=1] if you want to show only the services from a category with ID 1 that are assigned to the employee with ID 1,
- [ameliacatalog category=1 location=1] if you want to show only the services from a category with ID 1 that are provided on the location with ID 1,
- [ameliacatalog show=services] if you have Packages enabled, but you only want to show services in the form,
- [ameliacatalog show=packages] if you have Packages enabled, and you only want to show packages in the form.
- [ameliacatalog trigger=custom-id] - similar to the #10 under "Step-By-Step" booking form (check above)
For the Search view:
- [ameliasearch] if you want to show the basic search view,
- [ameliasearch today=1] if you want to show the search view with a preselected current date,
- [ameliasearch show=services] if you have Packages enabled, but you only want to show services in the form,
- [ameliasearch show=packages] if you have Packages enabled, and you only want to show packages in the form.
Please note: The Amelia Search booking form cannot include filters like Step-by-Step and Catalog booking forms do, so you can't add something like [ameliasearch service=1].
For the Event booking:
- [ameliaevents] or [ameliaevents type=list] if you want to show a list of all your events,
[ameliaevents tag='name']
if you want to show just the events that belong to the same tag defined during the creation of events, where “name” will be replaced with the tag name,- [ameliaevents event=1] if you want to show only the event with ID 1 without its recurring events,
- [ameliaevents event=1 recurring=1] if you want to show the event with ID 1 with all his recurring events.
- [ameliaevents type=calendar] if you want to show events in a calendar view.
Please note: If you're using tags in the shortcode, make sure to copy the single quotes from #2 in the list above because of issues with different keyboard layouts that may not apply the tag if used.
Amelia Front-end Customer Panel
- [ameliacustomerpanel appointments=1 events=1] if you want to show both Appointments and Events,
- [ameliacustomerpanel events=1] if you want to show only Events,
- [ameliacustomerpanel appointments=1] if you want to show only Appointments in the Customer Panel.
Amelia Front-end Employee Panel
- [ameliaemployeepanel appointments=1 events=1] if you want to show both Appointments and Events,
- [ameliaemployeepanel events=1] if you want to show only Events,
- [ameliaemployeepanel appointments=1] if you want to show only Appointments in the Employee Panel.
- [ameliaemployeepanel appointments=1 events=1 profile-hidden=1] - if you want the employee to see all his booked appointments and events, but prevent the employee from accessing the profile, where they can adjust their working hours, days off, special days, and assigned services