Skip to main content

Implement a booking widget on your Wordpress website

Implement booking widget Wordpress website: The Understory booking widget lets you display your booking flow directly on your own website, providing a smooth, fully integrated booking experience for your visitors.

Updated over 2 months ago

By embedding the widget, your guests can start and finalize their bookings without ever leaving your site. This solution is ideal for businesses wanting to keep their branding consistent and the booking process simple.

How to add the Understory booking widget or use the Understory WordPress plugin to your WordPress site

Requirements: You must have an admin account on both your Understory and WordPress website. If you are using the WordPress plugin method, ensure you have installed the official Understory plugin.

  1. Go to Storefront > Implementation in Understory – Opens the Implementation page

  2. Select the “Widget” booking flow type – Highlights Widget as your choice

  3. Pick the experience, language, storefront, and category – Updates widget code for your needs

  4. Click the copy button on the code snippet – Copies the widget code

  5. Open your WordPress Editor and select your page/post – Page/editor is now open

  6. Click the + icon and search “HTML” – Shows the “Custom HTML” block

  7. Add a “Custom HTML” block – Block with “Write HTML” appears

  8. Paste the copied widget code into the HTML block – Widget code is visible in the block

  9. Save and publish your page/post – Widget is now live on your website

Alternative Method Using the Understory Plugin

  1. Install the Understory WordPress Plugin: Download and activate the official Understory plugin from your WordPress Dashboard.

  2. Add Widgets or Shortcodes:

    • Open the page or post where you want to display Understory bookings.

    • Use the available widgets in the page builder to drag and drop booking components like the "Upcoming-events" widget to its desired location.

    • Alternatively, navigate to the plugin's Short Codes section, copy the relevant shortcode, and paste it into the page content or post editor where you want the feature embedded.

  3. Publish/Update Your Page: Ensure the plugins or shortcodes are correctly placed and save/publish your changes to make the booking feature live.

How the Understory Widget works

The Understory widget allows you to embed your booking process anywhere on your WordPress site. Your guests stay on your page, making bookings faster and more seamless—no new tabs or outside pages needed. The widget can be customized for specific experiences, languages, storefronts, or categories, matching your business needs. Alternatively, you can integrate the booking system using the Understory official WordPress plugin, which allows for easier setup through widgets or shortcodes, requiring no manual HTML embedding.

Tip: After publishing, always check how the widget appears to visitors, and if you’re unsure about editing website code, consider consulting a web developer.

Previewing the Customer Experience

After setting up bookings through Understory, it's important to understand how customers interact with the system. You can preview the functionality through your Understory booking page, which acts as the customer-facing interface.

  • Use the booking page to view how events, experiences, or calendars appear to the end user.

  • This preview ensures that the flow works smoothly and gives you confidence in the live setup.

Did this answer your question? If not, please reach out to us in the chat window at the bottom to the right, and we'll be happy to help 🤗

Did this answer your question?