Video Library

How to add ReservationKey search widget to a WordPress website.

Adding the ReservationKey Search Widget to a WordPress Website

This guide explains how to embed the ReservationKey search widget into a WordPress website using the built-in HTML widget (or Elementor HTML block). Once added, visitors can search for availability directly from your website and be redirected to your ReservationKey booking page with pre-filled dates.


Step 1: Copy the Search Box Code from ReservationKey

  1. Go to the Website tab in your ReservationKey account.
  2. Click Reservation Pages.
  3. Select the reservation page you want to link to.
  4. Scroll to the very bottom and click Linking to this page.
  5. Locate the section labeled Search Box Code.
  6. Click inside the box and press Ctrl + C (Windows) or Cmd + C (Mac) to copy the code.

Step 2: Open the Page in WordPress

  1. Log in to your WordPress Dashboard.
  2. Click Pages ? All Pages.
  3. Find the page where you want to add the search widget (for example, your homepage).
  4. Click Edit (or Edit with Elementor, depending on your setup).

If you’re unsure which page to edit, open your live website and use the browser’s address bar to confirm the correct page name before editing it in WordPress.


Step 3: Add the HTML Widget

The exact steps will depend on your WordPress editor:


Step 4: Adjust the Layout (Optional)

Depending on your theme, you may need to adjust the layout or styling of the search box.


Step 5: Save and Test the Widget

  1. Click Update or Publish to save your changes.
  2. Exit to the WordPress Dashboard.
  3. Open your live website and navigate to the page where the widget was added.
  4. Test the widget by entering check-in and check-out dates, then clicking Search.

If set up correctly, you should be redirected to your ReservationKey booking page with the selected dates pre-filled.


Step 6: Remove Old or Conflicting Widgets

If your WordPress theme came with a built-in booking or search form from another system, remove it to avoid confusion. Only the ReservationKey widget should remain active on the page.


Summary

By embedding the ReservationKey search widget via an HTML block, you can seamlessly integrate your booking system with your WordPress site. Your guests can search for available dates and proceed directly to your ReservationKey reservation page without leaving your website.