Configuration - Front Pages - Setup Colors And Layout
This section only applies if the module Webbookings is active.

The appearance of the costumer pages can be modified intirely as desired. This allows for the appearance to be tailord to match a corporate identity for example.

Navigate to the configuration modus by clicking on the Configuration button in the user dropdown menu, then choose Setup colors and lay-out below 'Front pages'.

Add theme

The button + Add allows for creating additional themes. Enter a name and discription for the theme (lower case only) in the dialog box that appears. The remaining entryfields of this dialog box are discused under the subheading 'Additional settings'. Click on the Save button to keep the added theme.

Take note: to load a theme, you must add the following to the booking dialog URL : &style=$ID. The $ID can be found behind the theme name selected and is displayed in brackets.

Adjust theme

There are various settings available to adjust the colours and lay-out of costumer pages. A theme can be modified in the configuration screen by clicking Setup colors and lay-out in the menu 'Front pages'. ‚ÄčAfter the desired theme has been selected it can be adjusted.

Once the required adjustments have been completed, the theme needs to be saved.

Additional settings

The Edit button opens a dialog box with the following entryfield:

  • Theme name
  • Theme description
  • Advanced (css)
  • Header
  • Footer
  • Default image

Adding CSS

If the setting options for the theme fall short, you can choose to implement a Cascading Style Sheet. The CSS will be loaded at the end, which allows for all the existing settings to be overwritten. Select the theme to be adjusted, choose Edit and use the 'Advanced (CSS)' entry field to insert CSS rules. CSS will only work when stated syntactically correctly.A CSS rule set consists of a selector and a declaration.

Set Header and Footer

The 'Theme' dialog box will also set the Header and Footer used on the front pages. A header can be found at the top of a page, as the footer stands at the bottom. Both ellements are mainly responsible for the look and feel of a webpage.

Choose Edit use the drop down menus behind 'Header' and 'Footer' to select the preferred header and footer. Click on the Save button in order to keep the changes.

Please note that it is possible for a header and footer to be selected in the dropdown menu only if they are added as a content block.

Set default image

Adding a default feature opens the possibility to display a logo on certain front pages. A default image can be uploaded in the dialog box 'Theme' which can be reached using the Edit button. Choose the icon next to 'Default image' in order to open the upload menu and click on Choose image. Use the file explorer to select the desired image on the pc and choose Open. Then click on the Save button to store the default image.

Wanneer je na het verversen van de frontpagina niet de doorgevoerde aanpassingen ziet, kan het nodig zijn de cache van je browser te legen.