Skip to main content

Design overview

Open Booking Engine → Design to influence how the search bar, booking summary, and unit filters look without editing PHP.

Design 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.

Unit filters — extra CSS

Option key: bec_styling_filters_extra_css

Free-form CSS for [bec_unit_filters] markup (.bec-unit-filters*, picker panels, amenity sheets). See bec_unit_filters and Listing Filters admin.


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.