CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/pypi-streamlit

A faster way to build and share data apps

Quality

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

The risk profile of this skill

This plugin was archived by the owner on Jun 3, 2026

Reason: Retiring all tiles created prior to the transition to plugin support

Overview
Eval results
Files

navigation-pages.mddocs/

Navigation and Pages

Multi-page application support, navigation controls, and execution flow management. Streamlit provides comprehensive tools for building sophisticated multi-page applications with navigation, routing, and execution control.

Capabilities

Page Configuration

Configure page-level settings and metadata for your Streamlit application.

def set_page_config(page_title=None, page_icon=None, layout="centered", initial_sidebar_state="auto", menu_items=None):
    """
    Configure page settings and metadata. Must be called at the very beginning of the script.

    Args:
        page_title (str, optional): Page title shown in browser tab
        page_icon (str, optional): Page icon (emoji or URL) shown in browser tab
        layout (str): Page layout ("centered" or "wide")
        initial_sidebar_state (str): Initial sidebar state ("auto", "expanded", "collapsed")
        menu_items (dict, optional): Custom menu items configuration

    Note:
        Must be the first Streamlit command in your script
    """

Example usage:

st.set_page_config(
    page_title="My Dashboard",
    page_icon="📊",
    layout="wide",
    initial_sidebar_state="expanded",
    menu_items={
        "About": "This is my awesome dashboard!",
        "Report a bug": "mailto:support@example.com",
        "Get help": "https://docs.streamlit.io"
    }
)

Multi-Page Navigation

Create and manage multi-page applications with structured navigation.

def navigation(pages, *, position="sidebar", expanded=True):
    """
    Define application navigation structure with multiple pages.

    Args:
        pages (list): List of Page objects or page configurations
        position (str): Navigation position ("sidebar" or "hidden")
        expanded (bool): Whether navigation starts expanded

    Returns:
        Page: Currently selected page object
    """

class Page:
    """
    Represents a single page in a multi-page application.

    Args:
        page (str or callable): Page file path or function
        title (str, optional): Page title for navigation
        icon (str, optional): Page icon (emoji or material icon name)
        url_path (str, optional): Custom URL path for the page
        default (bool): Whether this is the default page
    """

    def __init__(self, page, *, title=None, icon=None, url_path=None, default=False):
        pass

Example usage:

# Define pages
home_page = st.Page("pages/home.py", title="Home", icon="🏠", default=True)
data_page = st.Page("pages/data.py", title="Data Analysis", icon="📊")
settings_page = st.Page("pages/settings.py", title="Settings", icon="⚙️")

# Create navigation
pg = st.navigation([home_page, data_page, settings_page])

# Run the selected page
pg.run()

# Advanced navigation with sections
pg = st.navigation({
    "Main": [
        st.Page("home.py", title="Dashboard", icon="📈"),
        st.Page("reports.py", title="Reports", icon="📋")
    ],
    "Admin": [
        st.Page("users.py", title="User Management", icon="👥"),
        st.Page("settings.py", title="System Settings", icon="⚙️")
    ]
})

App Logo and Branding

Configure application logo and branding elements.

def logo(image, *, link=None, icon_image=None):
    """
    Set the application logo displayed in the navigation area.

    Args:
        image (str or bytes): Logo image file path, URL, or image data
        link (str, optional): URL to navigate when logo is clicked
        icon_image (str or bytes, optional): Smaller icon version for mobile/compact view
    """

Example usage:

# Set logo with link
st.logo("assets/company_logo.png", link="https://company.com")

# Logo with separate icon
st.logo(
    image="assets/logo_full.png",
    icon_image="assets/logo_icon.png",
    link="https://company.com"
)

Page Navigation Control

Functions for programmatically controlling page navigation and routing.

def switch_page(page):
    """
    Navigate to a different page programmatically.

    Args:
        page (str or Page): Page name, file path, or Page object to navigate to
    """

Example usage:

# Navigate based on user action
if st.button("Go to Data Analysis"):
    st.switch_page("pages/data.py")

# Navigate based on conditions
if not user_authenticated:
    st.switch_page("pages/login.py")

# Navigate with Page object
if st.button("Go to Settings"):
    st.switch_page(settings_page)

# Conditional navigation
user_role = get_user_role()
if user_role == "admin":
    st.switch_page("pages/admin.py")
elif user_role == "user":
    st.switch_page("pages/dashboard.py")

Execution Control

Control the execution flow of your Streamlit application.

def rerun():
    """
    Immediately rerun the current script from the top.

    Useful for refreshing the app state or triggering updates.
    """

def stop():
    """
    Stop execution of the current script.

    Nothing after this command will be executed in the current run.
    """

Example usage:

# Rerun after data update
if st.button("Refresh Data"):
    update_data()
    st.rerun()

# Stop execution based on condition
if not user_has_permission:
    st.error("Access denied")
    st.stop()

# Conditional execution
if data_needs_refresh():
    refresh_data()
    st.rerun()

# Stop with message
if not config_valid:
    st.error("Invalid configuration. Please check settings.")
    st.stop()

# The rest of the app continues here
st.write("Application content...")

Multi-Page Application Patterns

File-Based Pages

# main.py - Entry point
import streamlit as st

# Page configuration
st.set_page_config(
    page_title="Analytics Platform",
    page_icon="📊",
    layout="wide"
)

# Define pages
pages = [
    st.Page("pages/dashboard.py", title="Dashboard", icon="📈", default=True),
    st.Page("pages/data_upload.py", title="Data Upload", icon="📤"),
    st.Page("pages/analysis.py", title="Analysis", icon="🔍"),
    st.Page("pages/reports.py", title="Reports", icon="📋"),
    st.Page("pages/settings.py", title="Settings", icon="⚙️")
]

# Navigation
pg = st.navigation(pages)
pg.run()

Function-Based Pages

def home_page():
    st.title("Welcome to My App")
    st.write("This is the home page")

    if st.button("Go to Data"):
        st.switch_page(data_page)

def data_page():
    st.title("Data Analysis")
    st.write("Analyze your data here")

    # Data analysis code
    if st.button("Generate Report"):
        st.switch_page(report_page)

def report_page():
    st.title("Reports")
    st.write("View generated reports")

# Create pages
home = st.Page(home_page, title="Home", icon="🏠")
data = st.Page(data_page, title="Data", icon="📊")
report = st.Page(report_page, title="Reports", icon="📋")

# Navigation
pg = st.navigation([home, data, report])
pg.run()

Conditional Navigation

# Authentication-based navigation
def get_navigation():
    if not st.session_state.get("authenticated", False):
        return st.navigation([
            st.Page("login.py", title="Login", icon="🔐")
        ])

    user_role = st.session_state.get("user_role", "user")

    if user_role == "admin":
        return st.navigation({
            "Main": [
                st.Page("dashboard.py", title="Dashboard", icon="📊"),
                st.Page("analytics.py", title="Analytics", icon="📈")
            ],
            "Admin": [
                st.Page("users.py", title="User Management", icon="👥"),
                st.Page("system.py", title="System Settings", icon="⚙️")
            ]
        })
    else:
        return st.navigation([
            st.Page("dashboard.py", title="Dashboard", icon="📊"),
            st.Page("profile.py", title="My Profile", icon="👤")
        ])

# Use conditional navigation
pg = get_navigation()
pg.run()

URL-Based Routing

# Custom URL routing with query parameters
def handle_routing():
    # Get page from URL
    page = st.query_params.get("page", "home")

    # Route to appropriate function
    if page == "home":
        show_home()
    elif page == "data":
        show_data_page()
    elif page == "settings":
        show_settings()
    else:
        show_404()

def navigate_to(page_name):
    """Navigate to page and update URL."""
    st.query_params["page"] = page_name
    st.rerun()

# Navigation menu
col1, col2, col3 = st.columns(3)
with col1:
    if st.button("Home"):
        navigate_to("home")
with col2:
    if st.button("Data"):
        navigate_to("data")
with col3:
    if st.button("Settings"):
        navigate_to("settings")

# Handle the routing
handle_routing()

State-Aware Navigation

# Navigation that responds to application state
def get_current_page():
    # Determine page based on app state
    if "current_workflow" not in st.session_state:
        return "welcome"

    workflow_state = st.session_state.current_workflow

    if workflow_state == "data_loaded":
        return "analysis"
    elif workflow_state == "analysis_complete":
        return "results"
    else:
        return "data_upload"

def update_workflow_state(new_state):
    """Update workflow state and navigate."""
    st.session_state.current_workflow = new_state
    st.rerun()

# State-based page display
current_page = get_current_page()

if current_page == "welcome":
    st.title("Welcome")
    if st.button("Start Analysis"):
        update_workflow_state("ready")

elif current_page == "data_upload":
    st.title("Upload Data")
    uploaded_file = st.file_uploader("Choose file")
    if uploaded_file and st.button("Process"):
        # Process file
        update_workflow_state("data_loaded")

elif current_page == "analysis":
    st.title("Analysis")
    if st.button("Run Analysis"):
        # Run analysis
        update_workflow_state("analysis_complete")

elif current_page == "results":
    st.title("Results")
    st.write("Analysis complete!")

Navigation with Session State

# Initialize navigation state
if "nav_history" not in st.session_state:
    st.session_state.nav_history = ["home"]
    st.session_state.current_page = "home"

def navigate_with_history(page):
    """Navigate to page and maintain history."""
    st.session_state.nav_history.append(page)
    st.session_state.current_page = page
    st.rerun()

def go_back():
    """Navigate back to previous page."""
    if len(st.session_state.nav_history) > 1:
        st.session_state.nav_history.pop()
        st.session_state.current_page = st.session_state.nav_history[-1]
        st.rerun()

# Navigation controls
col1, col2 = st.columns([1, 4])
with col1:
    if len(st.session_state.nav_history) > 1:
        if st.button("← Back"):
            go_back()

# Page content based on current page
current_page = st.session_state.current_page

if current_page == "home":
    st.title("Home")
    if st.button("Go to Settings"):
        navigate_with_history("settings")

elif current_page == "settings":
    st.title("Settings")
    if st.button("Go to Profile"):
        navigate_with_history("profile")

docs

advanced-features.md

caching-performance.md

components-config.md

display-elements.md

index.md

input-widgets.md

layout-containers.md

navigation-pages.md

state-management.md

user-auth.md

tile.json