How to link a button to a webpage?

[Srinivasan_Gopalan_S]

I want to create a button and upon clicking, it should open desired webpage. Not sure how I can about it

[qxlsz]

May be use button to show up a hyperlink using markdown ?

[andfanilo]

Hey,

Would the following do the trick ?

import streamlit as st
import webbrowser

url = 'https://www.streamlit.io/'

if st.button('Open browser'):
    webbrowser.open_new_tab(url)

[romeodespres]

This only works locally but not when the Streamlit app is accessed over network (e.g. deployed to a server).

Here is a hack that works in all cases (but is a hack):

from bokeh.models.widgets import Div
import streamlit as st

if st.button('Go to Streamlit'):
    js = "window.open('https://www.streamlit.io/')"  # New tab or window
    js = "window.location.href = 'https://www.streamlit.io/'"  # Current tab
    html = '<img src onerror="{}">'.format(js)
    div = Div(text=html)
    st.bokeh_chart(div)

[dantuluri]

There need to be a better solution than this

[Sisekelo_Dlamini]

@romeodespres

from bokeh.models.widgets import Div
import streamlit as st

if st.button('Go to Streamlit'):
    js = "window.open('https://www.streamlit.io/')"  # New tab or window
    js = "window.location.href = 'https://www.streamlit.io/'"  # Current tab
    html = '<img src onerror="{}">'.format(js)
    div = Div(text=html)
    st.bokeh_chart(div)

This worked but it was slow, not user friendly but works.

[malraharsh]

Simply use this -

link = '[GitHub](http://github.com)'
st.markdown(link, unsafe_allow_html=True)

This will open the link when clicked on it.

[GTK-ARJUN]

Thanks a lot.

[Kasibanteg]

Hi andfanilo,
Am making an applications with multiple pages but I want a link like this below
Localhost:8501/page2 or some thing similar.
The st.experimental_get_query_params() doesn’t lead to my objective.
I want some thing atleast like how django,flask do their routing or even direct route
Am looking for a link that can be clicked and take me to my other streamlit pages in the same applications
Thank you

[andfanilo]

Hello @Kasibanteg,

This feature is currently in design for an official solution and hopefully out in the coming months. Until then, you’ll have to rely on mixing unofficial hacks with state, query params and programmatically loading modules for this.

Have you checked the following topics?

• Multi-page app with session state
• FrameWork for multipaging!

Cheers,
Fanilo

[Kasibanteg]

Yes, I checked all them out alreadyalready.
The only solution am going to use is to run main app and sub web pages on different ports, then I connect main app to the rest of the pages via markdown.
Thats what am doing right now and it seems to be perfect

[Rishav_Chowdhury]

I am getting the following error upon using this snippet. I have already pip installed bokeh.

[Seth_Gering]

Is there a way for the user to open multiple separate web pages when clicking a button? I tried the ideas mentioned in this post, but not getting multiple different pages to open when running on a server. Locally it runs as expected. For now I’m creating hyperlinks, but it would save my users some time if they could automatically open the links instead of having to click each individual hyperlink and then navigate back to the main page etc…

[kareemrasheed89]

Have we gotten this updated on streamlit, a button that help open a browser

[Lorenzo_MIRA_MATEO]

Same, I would like to know if an official solution came out. The solutions provided does not really fit my needs (open a link from another website + live website, not local). The only option that work, but is not at all user friendly is the solution provide by @Sisekelo_Dlamini

from bokeh.models.widgets import Div
import streamlit as st

if st.button('Go to Streamlit'):
    js = "window.open('https://www.streamlit.io/')"  # New tab or window
    js = "window.location.href = 'https://www.streamlit.io/'"  # Current tab
    html = '<img src onerror="{}">'.format(js)
    div = Div(text=html)
    st.bokeh_chart(div)

It does provide some visual changes when clicking on the button.

[Lorenzo_MIRA_MATEO]

Did you find out any viable solution(s)?

[Ankit_Singh]

IF you are trying to create a clickable link on the app deployed on cloud or as a docker container, then the problem is that it by default adds the exposed port of the docker container as a PREFIX.

Here is a fix for https links →

Just use the LINK as a STRING. That creates a clickable link on the app.

Example with Markdown:
st.markdown("[https: //en.wikipedia.org/wiki/DBSCAN"])

The above will create a link like →

[Rushmore]

You could use st.markdown to refresh the page and redirect it to the website of your choosing:

<meta http-equiv="refresh" content="0;url=http://example.com">

as an example from here

[Aravindh_P]

Hi! I am having the same doubt, if you found any way to link 2 pages through a button, let me know!

[Vinicius_Almeida]

Any updates here?
I’d like to create a button that redirects the user to other page inside my multipage streamlit app