Date picker and Book Now button widgets

The Date Picker widget lets visitors choose rental dates directly on your page. The Book Now Button widget is a standalone button that opens your booking flow.

Where to find it

Website → open a page → drag Date Picker or Book Now Button from the widget picker.

How it works

Date Picker

• Heading and Subheading: title and supporting line.
• Layout: Bar (a thin horizontal bar with faux date fields, the default), Calendar (a clickable month grid), or Stacked (a tall card with real date fields).
• Size: small, medium, or large controls.
• Show time inputs: adds an hour picker for pickup and return alongside the dates.
• When placed on the same page as a Fleet Grid widget, picking dates here filters that grid to show only what's available.

Book Now Button

• Label: the button text, default "Book Now."
• Size: small, medium, or large.
• Alignment: left, center, or right within its space.
• Style: primary (filled), secondary, or outline.
• Clicking it always sends the visitor to your checkout flow.

Example

An e-bike rental business might put a Date Picker in "Bar" layout at the top of the homepage, linked to a Fleet Grid below it — so as soon as a visitor picks their dates, the grid updates to show only bikes available then.

Good to know

• The Date Picker only filters a Fleet Grid when the two are placed on the same page and linked.
• Use the Book Now Button when you just want a simple shortcut to checkout without a date-picking step first.