Dash App - NavBar

Question

Has anyone had success creating and inserting a Navbar in their Dash app?

I have a custom css sheet for the other elements, but I understand I need to create the horizontal navbar object in the dash dummy code before calling to edit on the css side.

Where would I insert my navbar object in a Dashful fashion? Or rather, the ul list and list of hrefs specifically?

Answer 1

I put a navbar on each page of the app. I add it to the layout. like this:

layout = html.Div(children=[
    html.Nav(className = "nav nav-pills", children=[
        html.A('App1', className="nav-item nav-link btn", href='/apps/App1'),
        html.A('App2', className="nav-item nav-link active btn", href='/apps/App2') 
])...

This is one of the children of the main div in my layout. Classes above are from bootstrap.css The Dash HTML components are all listed here. I just figured this out myself today, so I am still refining the css.