Client Web App settings

This following tables describe all the Client Web App settings that can be customized to suit your business needs, as described in Customizing your web applications.

In this article:

    LAYOUT

    SettingDescription
    LAYOUTSelect one of four layout designs for the Client Web App. A preview of each layout is displayed on the settings page.

    • Layout 1 includes a main menu and a submenu in close proximity. Depending on the logo position you select the main menu will be aligned to the left or right of the screen while the submenu will always be aligned to the left.
    • Layout 2 drops the submenu into the main window of the web page. The alignment of the menus remains the same as in Layout 1.
    • Layout 3 moves your business logo below the main menu and submenu. Both menus are aligned to the left.
    • Layout 4 moves your business logo to the top of the screen and allows a header background image to appear behind the logo. Like Layout 3, both menus are aligned to the left.
      • If you select Layout 1 and Layout 3 you can customize the colors of the submenu. Customizing the colors of the submenu isn’t available for Layout 2 and Layout 4.

    COLOR CUSTOMIZATIONS

    SettingDescription
    Website colors
    • Background color – Select a color for the website’s background. This is illustrated in the layout previews in light blue.
    • Business name color – Select a color for the business name.
    Menu colors
    • Background color – Select a color for the background of the main menu.
    • Element color – Select a color for the text and icon of each main menu element.
    • Hover color – Select a color for the text and icon of each main menu element when a cursor is placed over it.
    • Pressed color – Select a color for the text and icon of each main menu element when it’s clicked.
    Submenu colors
    • Background color – Select a color for the background of the submenu.
    • Element color – Select a color for the text and icon of each submenu element.
    • Hover color – Select a color for the text and icon of each submenu element when a computer’s cursor is placed over it.
    • Pressed color – Select a color for the text and icon of each submenu element when it’s selected.

    NoteSubmenu colors can only be modified for Layout 1 and Layout 3.

    LOGO

    SettingDescription
    Business logo imageDetermines the appearance of your company logo on the Client Web App. We recommend that you use a .png image with a transparent background. The minimum and maximum resolution for this image is 240×150 pixels and 7680×4321 pixels respectively, and the maximum file size allowed is 20 MB.
    Logo positionDetermines the placement for your company logo on the Client Web App. Your options are Left, Center, or Right. Depending on the layout selected at the top of the page, some options won’t be available.
    Display the business nameDetermines whether the name of your business is displayed as text with your logo. Depending on the selected logo position, the business name will appear beside or under the logo.

    LOGO STYLE

    SettingDescription
    LOGO STYLESelect the logo style. This determines the shape your logo will be displayed as. You can select from the following options depending on the shape of your logo:

    • Hide – The logo is hidden from the page.
    • Square – The logo is displayed as a square.
    • Round – The logo is displayed as a circle.
    • Rectangle – The logo is displayed as a rectangle.

    HEADER IMAGE

    SettingDescription
    Display the header imageDetermines whether you want a background header image to be displayed or not. If this option is set to OFF, the background color is displayed throughout the header.

    NoteA header image is only displayed on the Client Web App if Layout 4 is selected.
    Header imageUpload the background header image that will be displayed. A high-resolution image results in a clearer image but will take longer to load for clients with poor internet connections.
    Header image styleThe style in which the header image is applied to the Client Web App.

    • Normal – The image is displayed in full resolution and isn’t repeated horizontally or vertically. This is ideal for images that are high resolution and not patterns. If the image is too small to fill the background of the client’s page header, the background color will be displayed.
    • Tiled horizontally – The image is displayed in full resolution and is repeated horizontally. This is ideal if the image is patterned horizontally and has enough vertical resolution to fill a client’s browser header. Non-patterned images will look odd as they repeat horizontally. Browser headers that have a greater height than the image will display the background color above and below the repeated image.
    • Tiled – The image is displayed in full resolution and is repeated horizontally and vertically. This is ideal if the image is patterned both horizontally and vertically. Non-patterned images will look odd as they repeat.

    CHECK-IN SETTINGS

    SettingDescription
    Clients can check in using the Client Web App and Achieve AppWhen this option is set to ON, clients can check in using the Client Web App and Achieve App.

    SCHEDULE SETTINGS

    SettingDescription
    Show class filter tilesWhen this option is set to ON, class filter tiles are displayed above the schedule to indicate the class types that are available to your clients. When a class filter tile is selected, the schedule is filtered to display only that class type.
    Show capacity informationWhen this option is set to ON, the total class capacity and the number of remaining open spots are displayed on the schedule.
    Display days with no scheduled serviceWhen this option is set to ON, days that don’t have scheduled services will be displayed on the schedule in the Client Web App.
    Show class duration in [format]Select a time format in which the class duration will be displayed. You can set the class duration to be displayed in Hours (1.5 h), Hours: Minutes (1h 30 min), or Minutes (90 min). By default, this option is set to Minutes.
    Schedule start dateSelect a day to use for the start of the schedule.

    SOCIAL SHARING OPTIONS

    SettingDescription
    Display share on Facebook buttonWhen this option is set to ON, your clients can click a button to share their booking details on Facebook after they book a session from your store. This button appears on the Client Web App and the Achieve Client App.
    Display share on Twitter buttonWhen this option is set to ON, your clients can click a button to share their booking details on Twitter after they book a session from your store. This button appears on the Client Web App and the Achieve Client App.

    STAFF NAME

    SettingDescription
    Display staff`s [option] in the client web and mobile applications.Determine how the names of your staff members are displayed on the Client Web App, Self Check-In Web App, Attendance Web App, and Achieve Client App. You have the following options:

    • First and last name – A staff member’s first and last name are displayed. For example, Anne Smith.
    • First name and initial of last name – A staff member’s first name and the initial of their last name are displayed. For example, Anne S.
    • First name only – Only a staff member’s first name is displayed. For example, Anne.
    • Initial of first name and last name – The initial of a staff member’s first name and their last name are displayed. For example, A. Smith.

    BOOK NOW TABS

    SettingDescription
    Book Now TabsChoose which book now tabs are displayed to clients on the Client Web App. You can also edit the names of the tabs, rearrange the tabs, or create a new tab.
    Was this article helpful?
    (141 out of 141 people found this article helpful )

    What can we do better?

    Thank you!
    Thank you for contacting us. We have received your request and will get in touch shortly.

    Contact Us

    We're ready to help you with everything to make your business great, but first check out our Support Center for all the information you need!
    Customization - Client Web App settings