Salesforce Docs Portal

Customizing Navigation Bars on Your POS App

Set up the navigation bar, hamburger menu, and tabs within the Point of Sale Point of Sale (POS) app. Control the tab display by selecting visibility options, such as always visible or visible to signed-in users only. Configure app settings like tab color, text color, and icon visibility to create a streamlined user experience.

Accessing and Editing Hamburger Menu

For details on configuring a hamburger menu, refer to this article.

Accessing & Editing Tabs

  1. In CMS, go to Apps > All.
  2. Edit a selected app configuration.
  3. To add a new tab, select + Tab.
  4. To delete a tab, select the red X.
  5. To change the order of tabs, drag a tab.
  6. Save your changes.Point of Sale CMS with tabs in a different order than the default layout.

Configure Tab Display Settings

Configure the display of the tab.

  1. Select a tab to open its Tab Settings toolbar on the right side of the screen.
  2. Under iOS Icon, upload an image to show as the tab's icon. Images are 65px by 65px.
  3. Under Name, enter the tab's display name for the POS app.
  4. Under Visibility, select one of these options:
    1. 'Always': The tab is always visible.
    2. 'Signed-in': Only signed-in users can see this tab.
    3. 'Signed-out': Only signed-out users can see this tab.
  5. Under Behavior, set the tab's behavior by selecting one of the options:
    1. 'Layout': displays a selected layout.
    2. 'Layout Group': displays a selected personalized layout. Learn More
    3. 'Deep Link': displays a selected deep link. However, if the deep link fails, a fallback layout is displayed.Point of Sale CMS with a customized Tab Display layout.

App Config Settings for Tabs

Setting Description
Tab Color Controls the background color of the tab. Note: This setting doesn't apply to iOS. For iOS, use iOS Tint Color to customize tab appearance.
iOS Tint Color Controls the color of the selected tab icon and other tinted UI elements on iOS. This is the recommended way to apply brand colors to tabs on iOS devices.
Tab Text Color Controls the text color of the tab
Hide Title From Bottom Tab Controls the visibility of the tab's text
Hide Icon From Bottom Tab Controls the visibility of the tab's icon
Hide Tab Bar Controls the visibility of all the tabs

App Config Settings for Navigation Bar

Setting Description
Hide Navbar Controls the visibility of the navigation bar
Show Logged In User on Top Bar Controls the visibility of the associate's login
Store Locator Container Controls the visibility of the store locator CTA on the navigation bar
Search Type Controls the visibility of the search icon on the navigation bar
Checkout Type Controls the visibility and behavior of the cart icon