Adding a Webba Booking form to your website is easy. You simply need to add the booking form shortcode in the location of the page or post where you want the booking form to appear.

Here is how to do it depending on the WordPress editor you use.

IMPORTANT: Only one Webba shortcode can be used per page/post.

Adding booking form in the Gutenberg Block Editor

Step 1. Open page (post) to edit or create a new page/post where you want to have the booking form.

Step 2. Click on the “+” plus sign to add a new block. Search for “Webba Booking Form” and select it.

Step 3. In the panel on the right, you can adjust any necessary settings of the Webba Booking form and then press “Update” or “Publish”.

Adding booking form in the Classic editor

Step 1. While in “Pages” or “Posts” list, click on “Edit (classic editor)” option.
Step 2. Copy/paste the shortcode of the booking form into it. See which shortcode to use in the section below.

Step 3. Press “Update” or “Publish” to make the booking form live or “Save to drafts” to continue working on it later.

Adding booking form in Elementor (or other similar drag&drop builders)

Step 1. While in “Pages” or “Posts” list, click on “Edit with Elementor” option (if you don’t see it, first open the page/post and then click on the blue button “Edit with Elementor”
Step 2. Search for “shortcode” widget. Drag and drop the widget to the location you want and copy/paste the shortcode of the booking form into it. See which shortcode to use in the section below.
Step 3. Press “Update” or “Publish” to make the booking form live or “Save to drafts” to continue working on it later.

Which shortcode should I use for the booking form?

Shortcodes are small code snippets that you can insert into your posts, pages, widgets, or theme files to display a specific function or content.

Webba has multiple shortcodes you may use and below is the explanation of when to use which.

1. ALL SERVICES Booking Form shortcode

[[webbabooking]]

If you use the All Services shortcode the booking form will show all the services you have created in the Webba Booking admin panel. A user will be able to select services to make a booking.

2. SINGLE SERVICE Booking Form shortcode

[[webbabooking service=x]] e.g. [[webbabooking service=52]]

If you use the Single Service shortcode the booking form will show a single service.

You have to choose which service by replacing ‘x’ with the ID of the service.

You can find the ID number of the service by going to “Services” page of Webba admin, finding the service you want and next to the name of the service, in brackets you’ll see the ID number.

Where to find Service ID:

3. SINGLE CATEGORY Booking Form shortcode

[[webbabooking category=x]] e.g. [[webbabooking category=52]]

If you use the Single Category shortcode the booking form will show a single category and all services included in that.

You have to choose which service by replacing ‘x’ with the ID of the category.

You can find the ID number of the category by going to the “Services” page of Webba admin, scrolling down to the “Categories” section, finding the category you want and next to the name of the category, in brackets you’ll see the ID number.

Where to find Service Category ID: