New Component: Streamlit Navigation Bar

Custom Components
, , ,
44

is it resolve?

45

any update?

46

Hi gabrieltempass, i am new to streamlit ā€¦ was trying use this navbar options but getting below screen have checked all dependenciesā€¦ but still no break through

Snip_TEMP0001-1
Snip_TEMP0001-11906Ɨ530 102 KB

47

I am having the same problem right now.

48

Thanks everyoneā€¦ was able to solve the issueā€¦ looks like this component is compatiable till 1.38 only was on 1.39 so it was not generatingā€¦ Experts may take this as a feedback and help to make it compatible for newer versionsā€¦

49

pls deprecate streamlit till 1.38 and check

50

The issue with the menu not appearing could be solved with CSS adjusting using margin-top: XXpx; on any version.

On the other hand, Iā€™ve found another issue that makes the menu not clickable, but also locking the sidebar.

Probably an interaction with the fact that Iā€™m displaying Streamlit on an iframe and/or conflicts with another library. Iā€™m not able to determine which one.

Edit: A brave sould has fixed the issue, st.sidebar expand button is not clickable with latest Streamlit version 1.38 Ā· Issue #26 Ā· gabrieltempass/streamlit-navigation-bar Ā· GitHub

1 Like
51

Hi all,

Since this component seems to be abandoned, I have forked the repository to the streamlit-community organization. You can find the new repository at: GitHub - streamlit-community/streamlit-navigation-bar. In this version I have fixed several issues that are reported here.

To install the new component use pip install streamlit-community-navigation-bar.

Since I am actively using this component, I will also try to solve issues as they come along. However, this is done on a volunteer basis and I may not always have time. Contact me if you also want to contribute. I can be found via: hansthen (Hans Then) Ā· GitHub

I created the streamlit-community organization to host this and possibly other abandoned components. However, you are perfectly welcome to host a component your are still actively working on under the streamlit-community organization.

3 Likes
52

Hi Hansthen, does the new community navbar work with streamlit 1.41 ?

53

The three test supplied programs work with streamlit 1.41. We do not have fully automated tests yet. (Pull requests are welcome.)

54

Awesome thanks. I think it was a clash with my virtual environment.

55

Would it be possible to change the font through the navbar parameters? Or do you need a custom css st.markdown?

56

Yes you can, using the styles parameter. If you set a font-size on span it will be applied to the menu items.

1 Like
57

image
image1920Ɨ1080 240 KB

I have cloned the github repo to use it, but the elements in navbar is not visible
anyone please guide

58

Please use the new component: pip install streamlit-community-navigation-bar.

59

@gabrieltempass
I am looking for the dropdown on the navbar. Any clue when this will be released please.

60

for some reason in the last version of streamlit, this is conflicting with my pages configuration, the pages sidebar disappears when I put the navbar in any part of the code

61

I added an issue to support mobile when you have lot of items. Instead of stretch you can add an overflow/dropdown menu.