Website integration

Once your vehicles and payment method are configured, the Web integration section gives you everything you need to display your booking module on your website. Two options: paste an HTML code where the module should appear, or share a direct link if you don’t have a website. The preview updates every time you save.

Adding the module to your website

In the Web integration section, copy the HTML code to insert into your website, then paste it into your page’s HTML, exactly where the module should appear. The code takes the form of an iframe tag:

<iframe src='https://app.clickchauffeur.com/module/your-identifier'
        width="600" height="950"></iframe>

• The Copy button places the code in your clipboard; a “Code copied!” message confirms the action.
• The identifier is unique to your account: do not change it.
• The width and height attributes reflect the Module size you saved (see below).

This code works on WordPress, Wix and any other website that accepts HTML embedding.

• WordPress: add a Custom HTML block in the page editor, then paste the code.
• Wix: add an Embed a code / HTML element and paste the code inside it.
• Other websites: paste the code into the page’s HTML area, at the desired location.

Sharing a direct link

If you don’t have a website, or to send your module by message, email or social media, use the Direct link to your booking module. This link opens the booking module without embedding it on a website. The Copy button confirms with “Direct link copied!”.

Customizing the module

Under Module customization, several settings let you adapt the module’s appearance and behavior. After each change, click Save: the preview updates.

Module design

Choose the module design:

• Classic — the module’s original layout.
• Modern — a design that adapts automatically to the iframe width (map on the right on wide screens, stacked elements on mobile).

Title and text

• Title — the form title. It is not displayed if an image is uploaded.
• Text — the text shown below the title; use it to give useful information to your customers.
• Form picture — a header image (it replaces the title in the display). You can remove the current image at any time.

Display

Turn on or off the fields offered to your customers in the module:

• Show map — displays a map in the module.
• Number of passengers — if disabled, the number of passengers is not taken into account when calculating fares, even if a vehicle’s price per passenger is set.
• Number of baggage — if disabled, the baggage count input is not displayed in the module.
• Vehicle type — if disabled, the vehicle dropdown is not displayed and the default vehicle is used.
• Trip type — if disabled, the customer cannot choose a round trip.

Module size — set the width and height (in pixels) of the module. These values feed the width and height attributes of the HTML code.

Colors

• Icon color — the color of the icons shown in the module.
• Button color — the color of the module’s action button.

Redirection

Redirection URL after booking — the address the customer is sent to once their booking is completed (for example a thank-you page on your website).

Map and Google Maps

If you enable Show map, two additional settings become useful:

• Map center coordinates — set the Latitude, the Longitude and the Zoom level of the center displayed by default. The Select on the map button lets you choose this point visually.
• Google Maps API — enter your Google Maps API key to take advantage of Google Maps in your booking module.

Check before publishing

Before pasting the code on your website, use the Preview in the Web integration section: it shows your module exactly as your customers will see it, with your dimensions, your colors and your settings. Adjust, Save, check the preview, then copy the code.

Free plan

The booking module and its integration (HTML code and direct link) are available from the free plan. As a reminder, the free plan limits: 5 bookings per month, 1 vehicle, and no online payment (driver payment only). For an unlimited module and online payment, upgrade to a paid plan. See the Pricing page.