You can customize the look and feel of the bottom navigation bar by changing the background color, labels, icon style, and icon color in active and inactive states and light and dark modes.

  1. At the organization level, navigate to Admin > Organization > Organizations > Online Booking > CX V3 template.

  2. Click Bottom Navigation Bar.

  3. Configure the Default menu:

    • In the Menu section, select the order of the bottom navigation bar icons.

    • In the Menu label, enter the text for the bottom navigation bar icons.

    • In the Link to section, link the icons to respective sections on the app.

  4. Icon color: Choose the icon colors for active and inactive states in Light Mode and Dark Mode.

    To change the color, click inside the relevant field and pick a color. Alternatively, you can change the color by entering the hex color codes. (Example: Hex color code for red is #FF0000)

  5. Navigation Bar background color: Choose from the following options:

    • Default Color (Recommended)

    • Custom Color

      If you choose custom color, you can change the colors for both Light Mode and Dark Mode. Or, you can change the color by entering the hex color codes.

      (Example: Hex color code for red is #FF0000)

  6. Show Labels in Navigation Bar for: Choose from the following options:

    • All Icons

    • Only Active Icon

    • No labels

      Note: Color of the label is the same as its icon color.

  7. Click Save.

Did this answer your question?