# Is it possible to create a navigation thru image system?

**URL:** <https://discuss.streamlit.io/t/is-it-possible-to-create-a-navigation-thru-image-system/75103>\
**Category:** Using Streamlit\
**Tags:** navigation, image, page\_link, discussion\
**Created:** [July 17, 2024, 9:17am UTC](https://discuss.streamlit.io/t/is-it-possible-to-create-a-navigation-thru-image-system/75103 "2024-07-17T09:17:20Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Christian-jaimes](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/christian-jaimes/32/46388_2.png) [@Christian-jaimes](https://discuss.streamlit.io/u/Christian-jaimes)\
**Post date:** [July 17, 2024, 9:17am UTC](https://discuss.streamlit.io/t/is-it-possible-to-create-a-navigation-thru-image-system/75103/1 "2024-07-17T09:17:20Z")

</div>

I am looking to create a menu inside an application, I am using a side bar already, (home, documentation and settings) but I am looking to add an extra navigation within my home page, that will navigate to another pages that are specific functions of the app (these are not intended to be shown in the side bar, something like this:

 ![image](https://global.discourse-cdn.com/streamlit/original/3X/c/2/c2baec27f3547c38392efe87800aee9826a9907d.png)

I have been trying with

```auto
st.markdown(
    f"""
    <a href="set-up">
        <img src="https://image.com" alt="Logo" style="width:200px;">
    </a>
    """,
    unsafe_allow_html=True
)

```

and

```auto
st.html('''
        <a href="set-up"><img src="image.com/logo.svg" alt="logo" style="width:200px;"></a>
        ''')

```

as you can see I reference the page in the \<a href= as “set-up” that is the name of my file/page (set-up.py)

and they show in the app, but when I try to click it, the application starts to load for ever…

---

<div class="post-metadata">

**Author:** ![Faltawer](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/faltawer/32/46117_2.png) [@Faltawer](https://discuss.streamlit.io/u/Faltawer)\
**Post date:** [July 17, 2024, 9:28am UTC](https://discuss.streamlit.io/t/is-it-possible-to-create-a-navigation-thru-image-system/75103/2 "2024-07-17T09:28:05Z")

</div>

Hey, you should check [Streamlit-option-menu is a simple Streamlit component that allows users to select a single item from a list of options in a menu](https://discuss.streamlit.io/t/streamlit-option-menu-is-a-simple-streamlit-component-that-allows-users-to-select-a-single-item-from-a-list-of-options-in-a-menu/20514)

> **[GitHub - victoryhb/streamlit-option-menu: streamlit-option-menu is a simple...](https://github.com/victoryhb/streamlit-option-menu)**
>
> streamlit-option-menu is a simple Streamlit component that allows users to select a single item from a list of options in a menu. - GitHub - victoryhb/streamlit-option-menu: streamlit-option-menu ...

It allow you to use function instead of page (the result is the same, but i thing it’s much easier to manipulate the function, I really enjoy using it)  
And after you can juste do some grid of buttons to functions to display the content.

---

<div class="post-metadata">

**Author:** ![Christian-jaimes](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/christian-jaimes/32/46388_2.png) [@Christian-jaimes](https://discuss.streamlit.io/u/Christian-jaimes)\
**Post date:** [July 17, 2024, 9:39am UTC](https://discuss.streamlit.io/t/is-it-possible-to-create-a-navigation-thru-image-system/75103/3 "2024-07-17T09:39:47Z")

</div>

That’s interesting, sadly only accept “Bootstrap Icons” so pretty limited

---

<div class="post-metadata">

**Author:** ![Oscar](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/oscar/32/43907_2.png) [@Oscar](https://discuss.streamlit.io/u/Oscar)\
**Post date:** [July 17, 2024, 2:39pm UTC](https://discuss.streamlit.io/t/is-it-possible-to-create-a-navigation-thru-image-system/75103/4 "2024-07-17T14:39:42Z")

</div>

Hi,

Check this demo:

> **[streamlit antd components](https://nicedouble-streamlitantdcomponentsdemo-app-middmy.streamlit.app/)**
>
> This project is a demo app of streamlit-antd-components,detailed usage of every component.

---

<div class="post-metadata">

**Author:** ![system](https://global.discourse-cdn.com/streamlit/original/3X/c/f/cf4c2ee0d938358f82448c5fe4b9c3c91d7ce19c.svg) [@system](https://discuss.streamlit.io/u/system)\
**Post date:** [January 13, 2025, 2:40pm UTC](https://discuss.streamlit.io/t/is-it-possible-to-create-a-navigation-thru-image-system/75103/5 "2025-01-13T14:40:33Z")

</div>

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