How do I customize the look of the Explorates widget on my website?

Open your product, then Integration in the product sidebar.

First choose the format: Booking calendar, to place on a product page you have already written, or Product page, which shows photos, details and calendar.

Then set the look under Widget configuration:

• the primary color, reused on the product selection, the calendar days and the booking summary;
• the first day of the week, Monday or Sunday;
• the border around the widget, shown or hidden;
• the currency offered to the buyer by default, when there are several;
• the language of the content and of the widget itself.

The preview updates as you go. Once you are happy with it, copy the integration code and paste it on your website.

Each product has its own settings: nothing stops you from having a red widget for one and a blue one for another.

Widget width

The booking calendar adapts to the spot where you paste it: it takes the available width, up to 672 pixels. In a wider column, it stops at that size to stay easy to read. There is nothing to set up.

To go wider, add the data-max-width attribute to the integration code, right after class="explorates-widget":

data-max-width="100%"

Use 100% to fill the whole column, or a value in pixels, for example 900px. Any other value is ignored. This setting is not available in the WordPress plugin yet.