Learn about the CSS Editor option, including how to make custom changes to the Booking Page.
New to the Booking Page? Read the first article in this series for an introduction to the Booking Page.
Which plans include this feature?
Legacy: Soho, Pro, Plus, Enterprise, Flex
New: Growth (Subscription), Growth (Online Booking Fee), Managed
→ Learn more about our new plans or how to change your plan.
Where can I find this feature using the top menu?
Manage > Layout > Booking Page
What more do I need to use this feature?
- Admin permissions to configure Booking Page options.
- Basic CSS knowledge.
Which Checkfront version supports this feature - classic, new or both?
- This feature is available in both our classic version using items (Inventory > Items) and our newest version using products (Inventory > Products). → Learn more about products
Working with the CSS Editor
If you are familiar with CSS, you can make such changes using the CSS editor in the left sidebar. CSS is a language for specifying how documents are presented to users - how they are styled, laid out, etc.
Some elements need to be explicitly overridden, for example, button {background-color: #red !important}
|
If you want to make CSS changes and are unfamiliar with CSS, you may visit a site such as Mozilla.org or W3schools.com, both excellent online resources for learning CSS. Alternatively, you could consider hiring a developer to make the changes. We do not officially provide support for custom CSS changes, as the codes could potentially change with updates and new releases and no longer work as expected. |
|
Are you looking for an easier way to style the Booking Page? Check out the Booking Page Style Editor, an experimental feature in Checkfront Labs. Learn more about the Booking Page Style Editor here: |
< Previewing your booking page layout | Translating booking page layouts >