Skip to main content

Styling overview

Open Booking Engine → Styling to influence how the search bar and booking summary look without editing PHP.

Styling settings page


Shared theme variables

Large textarea labelled Shared theme variables accepts Custom Property lines (CSS variables) or small rules. The plugin injects them alongside preset styles so both the search UI and booking summary can read consistent colours, radii, or fonts.

Example (illustrative):

--bec-brand: #1a365d;
--bec-radius: 8px;

Search bar section

ControlPurpose
Layout styleEnhanced (date range + guest popover) vs Classic (separate controls).
Extra CSSFree-form rules targeting search wrapper classes—see Search form presets.

Booking summary section

ControlPurpose
Layout styleDefault vs Compact desktop layout.
Rate details accordionsToggle Inclusions / Conditions panels when quote text provides them.
Extra CSSTargets booking summary DOM structure.

Sanitisation & safety

CSS fields run through sanitisation that blocks obviously dangerous sequences (such as raw HTML openers inside the textarea). Stay within reasonable length limits—split huge stylesheets into your theme if necessary.