Embeded Streamlit App Footer?

Hello Streamlit Community,

iโ€™m curious if it is possible to hide the footer when embedding a Streamlit Application?

As an example below:

I have a separate section linked to streamlit.io within my app but that footer kind of interferes with my website.

Hi @mvnchi

Yes, it is possible to remove the footer, you can hide it via CSS customization. The name of the CSS element to hide can be figured out by using the inspect element in Google Chrome. More details about how to do so is demonstrated in this video:

Hope this helps!

Best regards,
Chanin

1 Like

Thank you for your reply. I have the same problem. Such a footer appears only in embedded apps, so I tried the following code, but it doesnโ€™t help.

hide_st_style = """
            <style>
            #MainMenu {visibility: hidden;}
            footer {visibility: hidden;}
            header {visibility: hidden;}
            div.embeddedAppMetaInfoBar_container__DxxL1 {visibility: hidden;}
            </style>
            """
st.markdown(hide_st_style, unsafe_allow_html=True)

Hi - Iโ€™m having the same problem. Has anybody found a solution to this?

Hey @echanx24 and @bondares,

I assume youโ€™re using the latest version of Streamlit?

I know that what is possible to do with CSS tweaking may change from version to version, and a CSS trick that worked before may not work anymore.

Maybe @dataprofessor has a workaround for this? :slight_smile:

Best,
Charly

This works when Iโ€™m running my streamlit app locally and embedding it. But when itโ€™s from the community cloud, it ignores this for some reason.

The only way to get rid of it I've found is cover it up.
See this answer

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.