How to Add Online Booking to Your WordPress Website

Want customers to book appointments directly through your WordPress website? You don't need to build a booking system from scratch or install a complicated WordPress plugin.

With an online appointment scheduling platform like ClimbCal, you can create a professional booking page, configure your availability, and embed the booking experience directly into your existing website.

Whether you're a consultant, coach, tutor, freelancer, or small business owner, adding online booking makes it easier for customers to schedule appointments without the back-and-forth of emails and phone calls.

In this step-by-step guide, we'll show you how to add online booking to your WordPress website using ClimbCal, including instructions for websites built with Elementor.

Why add online appointment booking to WordPress?

Your website might already explain your services, showcase your work, and provide contact information. But what happens when a potential customer is ready to book?

If they have to send an enquiry and wait for a response, you're adding an unnecessary step.

An online booking system makes the process simpler for everyone.

With ClimbCal, you can:

• Accept bookings 24/7. Customers can view your available appointment times and book whenever it suits them.
• Reduce scheduling emails. Customers choose from your available times without needing to contact you first.
• Avoid double bookings. Connect your Google or Microsoft calendar so existing commitments are taken into account.
• Offer different appointment types. Create separate booking pages for consultations, lessons, meetings, and other services.
• Collect payments or deposits. Connect Stripe to accept payments during the booking process on supported plans.
• Keep everything organised. Manage appointments and scheduling from one dashboard.

And because ClimbCal works independently of WordPress, you don't need to manage a separate booking database or maintain a dedicated WordPress booking plugin.

What you'll need before getting started

To follow this tutorial, you'll need:

1. An existing WordPress website.
2. Access to your WordPress dashboard.
3. A ClimbCal account.
4. A ClimbCal Standard or Advanced plan if you want to embed your booking page directly into your website.

ClimbCal also offers a Free plan, which allows you to create a public booking page and share its link. However, inline website embedding requires a Standard or Advanced plan.

You can compare ClimbCal plans here.

Step 1: Create your appointment type in ClimbCal

The first step is to create an appointment that customers can book.

In ClimbCal, these are called Event Types.

An Event Type represents a particular appointment, such as:

• Free 30-minute consultation
• 60-minute coaching session
• Initial client appointment
• Online tutoring lesson
• On-site consultation

Each Event Type has its own booking page, duration, scheduling rules, and customer questions.

To create one:

1. Sign in to your ClimbCal dashboard.
2. Select Event types from the left-hand menu.
3. Click New event type.
4. Enter the event information in the Basic details section.

Give your appointment a clear title and description so customers understand what they're booking.

You can also specify a meeting address if the appointment takes place at a physical location.

Step 2: Configure your scheduling and availability

Next, decide when customers can book appointments.

Open the Scheduling section of your Event Type.

Here you can configure:

• Appointment duration: How long each booking lasts.
• Default duration: The duration selected by default if you offer multiple options.
• Slot interval: How frequently appointment start times are offered.

For example, you might offer a 60-minute consultation with appointments starting every 30 minutes.

ClimbCal uses the timezone configured in your Availability settings.

Set your working hours

Open Availability from the ClimbCal dashboard to define your regular working schedule.

For example:

• Monday to Friday: 9:00 am–5:00 pm
• Saturday: 9:00 am–12:00 pm
• Sunday: Unavailable

You can also configure date overrides for holidays, days off, or changes to your regular schedule.

If you connect your Google or Microsoft calendar, ClimbCal can check existing calendar commitments when determining which appointment times to offer.

This means customers see times that work with your actual schedule.

ClimbCal’s live demo: customers choose an available date and appointment time. Your colours and appointment details can be customised.

Step 3: Customise your booking settings

Before publishing your booking page, it's worth reviewing the other Event Type settings.

ClimbCal provides six configuration sections.

Basic details

Set the appointment title, description, location, and whether the event is active.

Scheduling

Configure appointment durations and the interval between available start times.

Booking rules

Control how customers can book, including minimum notice, how far in advance appointments can be made, daily booking limits, and buffer time around appointments.

For example, you could require at least 24 hours' notice before a customer can book.

Guest questions

Collect information from customers during the booking process.

You might ask:

• What would you like to discuss?
• Is this your first appointment?
• Is there anything we should know before the meeting?

ClimbCal supports different question formats, including short text, long text, dropdowns, and confirmation questions.

Payment

If you use a supported plan and have connected Stripe, you can choose whether customers pay nothing upfront, pay the full amount, or leave a fixed deposit when booking.

Policies

Add your cancellation and rescheduling expectations so customers know the conditions before making an appointment.

Once you've finished configuring the Event Type, click Save event type.

Step 4: Generate your website booking embed code

Now comes the important part: adding your booking page to WordPress.

ClimbCal can generate the HTML code required to display your booking experience directly inside your website.

You don't need to write the code yourself.

Follow these steps:

1. In ClimbCal, open Event types.
2. Choose your appointment from the Current event dropdown.
3. Open the Basic details section.
4. Find the Customer booking page area.
5. Click Add to Website.
6. Preview the embedded booking experience.
7. Copy the generated iframe HTML code.

An iframe is a standard web technology that allows one webpage to display content from another.

In this case, it allows your ClimbCal booking experience to appear within your WordPress page.

Your visitors can select their appointment time and complete the booking without having to navigate away from your website.

Step 5: Add online booking to WordPress

There are two straightforward ways to embed your ClimbCal booking page, depending on which WordPress editor you use.

Option A: Using the WordPress Block Editor (Gutenberg)

If you're using the standard WordPress editor, follow these steps. You will need an account with permission to add iframe code:

1. Log in to your WordPress dashboard.
2. Navigate to Pages → Add New, or edit an existing page.
3. Give your page a title, such as Book an Appointment.
4. Click the + button to add a new block.
5. Search for Custom HTML.
6. Select the Custom HTML block.
7. Open the HTML editor and paste the iframe code you copied from ClimbCal. In newer WordPress versions, select Edit HTML, paste into its HTML panel, then select Update to apply the block changes.
8. Preview your page to check how the booking interface appears.
9. Click Publish or Update.

Your ClimbCal booking page should now appear directly inside your WordPress website.

You can add text above the booking area, such as a short description of the appointment or instructions for customers.

Option B: Using Elementor

If your WordPress website was built using Elementor, the process is just as straightforward. The HTML widget is restricted to administrators by default; if you cannot find it, ask your site administrator for help.

1. Open your WordPress dashboard.
2. Create a new page or open an existing page.
3. Click Edit with Elementor.
4. Add a new container or select the section where you want the booking interface to appear.
5. Search the Elementor widget panel for HTML.
6. Drag the HTML widget into the desired location.
7. Paste the iframe code generated by ClimbCal.
8. Click Publish or Update.

That's it! Your online booking page is now embedded in your Elementor website.

If the booking area looks too short or displays unnecessary scrollbars, review the iframe dimensions in your generated embed code or the height of its surrounding section.

Step 6: Test your online booking page

Before sharing your new booking page with customers, take a moment to test the complete experience.

Open the published page in a private or incognito browser window.

Check that:

• The booking interface loads correctly.
• Available appointment dates and times are displayed.
• Customers can select an appointment.
• Required questions appear correctly.
• The booking can be completed successfully.
• Confirmation emails arrive as expected.
• The booking appears in your ClimbCal dashboard and connected calendar, where configured.

It's also important to test the page on a mobile phone.

Once you're happy with the results, add the page to your website's navigation menu or link to it using a Book Now button.

The next step collects customer details and guest questions, then displays the cancellation policy before confirmation. Screenshot from the fictional demo business.

Alternative: Add a booking button instead of embedding

Not every business needs an embedded booking calendar.

If you prefer, you can simply link customers to your public ClimbCal booking page.

To get your booking link:

1. Open Event types in ClimbCal.
2. Select the event you want to share.
3. Go to Basic details.
4. Click Copy link.

You can then add this link to any WordPress button, menu item, or text link.

For example, you could place a prominent Book a Free Consultation button on your homepage.

When customers click it, they'll be taken to your ClimbCal booking page to choose an appointment.

This is also a useful option for businesses using ClimbCal's Free plan.

Frequently asked questions

Start accepting online bookings with ClimbCal

Adding online appointment booking to WordPress doesn't have to be complicated.

With ClimbCal, you can configure your appointments, manage your availability, and generate the HTML code needed to integrate booking directly into your website.

Whether you're running a one-person consulting business or growing a team, ClimbCal gives you a straightforward way to manage bookings without unnecessary WordPress plugins.

Ready to see how it works?

Try the interactive ClimbCal booking demo and experience the booking process from your customers' perspective. No account is required.

Or create your free ClimbCal account and start setting up your first booking page today.

Editor references: WordPress Custom HTML block · Elementor HTML widget · WordPress.com iframe requirements.