← All guides

WordPress · Booking forms

How do you add a booking form to an old WordPress taxi site?

Published 4 August 2026 · updated 3 September 2026 · 6 min read

Short answer

Paste a single self-contained script tag into the page where you want the form. On an old WordPress site, a widget that renders inside Shadow DOM is the safest option because the theme's CSS cannot reach inside it, so nothing about your existing design has to change.

The three realistic options

Operators running a WordPress site built between 2012 and 2018 usually have a phone number, a contact form, and no way to quote a price. There are three ways out of that, and they differ mostly in how much of your existing site they put at risk.

OptionSetup effortRisk to your themeOngoing cost
Full booking pluginHours to daysHigh — plugins fight themes and each otherRecurring, plus update breakage
Hosted booking platform iframeMinutesLow, but you rent your booking flowMonthly per booking or per seat
Embedded script widgetMinutesVery low with Shadow DOMOne-time licence, optional support

Why old themes break new forms

Themes from that era set global rules on inputs, buttons, and labels, frequently with !important and content-box sizing. Anything you drop into the page inherits them. That is why a form that looked correct in the vendor's demo arrives on your site with 14px Comic Sans inputs, dotted borders, and a submit button the width of the screen.

Shadow DOM is the fix, not stronger CSS. A widget mounted in a shadow root does not inherit page styles at all, so there is no specificity war to lose.

Installing a script widget in WordPress

  1. 1Upload the widget's JavaScript file to your host, or leave it wherever the vendor serves it from.
  2. 2Edit the page, add a Custom HTML block where the form should appear (Text tab in the classic editor).
  3. 3Paste the script tag and the configuration block the vendor's builder generated.
  4. 4Publish, then load the page in a private window to check it renders for a visitor and not just for a logged-in admin.
<div id="chauffeur-quote"></div>
<script src="/wp-content/uploads/chauffeur-quote.min.js" defer></script>
<script>
  window.ChauffeurQuoteConfig = {
    mount: "#chauffeur-quote",
    endpoint: "/wp-content/uploads/quote-handler.php",
    business: { name: "Your Cars", email: "bookings@example.com" }
  };
</script>

What to check before you send traffic

  • Submit a real test request and confirm the email arrives, including to a spam folder.
  • Confirm the handler writes a log file, because mail() fails silently on most shared hosting.
  • Load the page on a phone: old themes often have a fixed-width container that clips wide forms.
  • Check a caching plugin is not serving a version of the page from before you added the block.

The last one accounts for a surprising share of "the form does not appear" reports. Purge the cache after any change to a page containing a widget.

Frequently asked

Do I need a plugin to add a booking form to WordPress?
No. A self-contained script tag placed in a Custom HTML block works on any WordPress version and adds nothing to your plugin update surface.
Will a booking widget break my theme?
It will not if the widget renders in Shadow DOM. Shadow DOM isolates the widget's styles from the page, so theme rules — including ones marked !important — do not apply inside it.
Where should the booking form live on the site?
On the homepage above the fold and on a dedicated /book page. Most enquiries come from visitors who already decided to book and only need somewhere to type.

Chauffeur Quote Widget

One script tag, Shadow DOM isolated, zone-based fixed prices, no maps API key in your page. $149 one-time plus $9/month for updates and support.

Keep reading