Tabs and navigation

Tabs and navigation allow you to produce apps that have multiple pages.

Common structure

Here is a simple example of an application with two tabs, which users can toggle between.

#| standalone: true
#| components: [editor, viewer]
#| layout: vertical
#| viewerHeight: 150

from shiny import App, ui

app_ui = ui.page_fluid(
    # style ----
        # elements ----
        ui.nav("a", "tab a content"),
        ui.nav("b", "tab b content"),

app = App(app_ui, None)

Navigation consist of two parts:

  • a navset_*() style container that determines what the navigation will look like.
  • nav_*() elements that create different pieces of content.

The example above only shows a single nav element, nav(), which creates a new tab. However, other elements exist to control tab spacing, and create dropdown menus.

On this page, we’ll look first at options for navigation styles, and then at the different navigation elements available.

See these docs/examples: