Login

Help

Documentation

Tab Bar

Twixl Support Team Updated: - Created :

    The Tab bar provides an additional way to make navigation in your app easier. It allows users to navigate directly from any collection in browse view to any other collection in the app or to a web page.

    To display the Tab bar, the app must be built with Twixl Publisher 27.0 or later.

    1. How to enable the Tab bar

    The Tab bar isn't enabled by default.

    To enable this collection, just click on the enable icon.

    Once enabled, a content item 'Home' linking to the Root Collection, is added by default. You can change or delete this content item.

    2. How to design the Tab bar

    The Tab bar is designed via the Tab bar section in Design > Theme.

    You can set the used font type and the font color and background color.

    On iOS, the Liquid Glass feature impacts how the background color in the tab bar is displayed. This is normal and by design from Apple.

    The font size is fixed. If your text is not readable in the tab bar, we recommend using a different font.

    3. Adding navigation items

    The navigation items in the Tab bar can be added like any other content items in collections.

    Click the '+' icon > Enter the url link if you want to add a web link (external) or select a collection link (internal) > Click 'Save'

    In the Content to Upload section, you can add the icon, change the title and add a publication date.

    You can add up to 5 items in the Tab bar.

    4. More options

    By opening the tab bar content item, one can select other titles for phones and tablets, change the link and change the icon, change the publish and unpublish date.

    5. How to disable the Tab bar

    To disable the Tab bar, click the disable icon. Your content items will remain in the Twixl platform, but the Tab bar will not be displayed in the app.