# Breadcrumb in Perspective module

**URL:** <https://forum.inductiveautomation.com/t/breadcrumb-in-perspective-module/115443>\
**Category:** Module Development\
**Tags:** perspective\
**Created:** [May 7, 2026, 7:23pm UTC](https://forum.inductiveautomation.com/t/breadcrumb-in-perspective-module/115443 "2026-05-07T19:23:18Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![torstein](https://avatars.discourse-cdn.com/v4/letter/t/f0a364/32.png) [@torstein](https://forum.inductiveautomation.com/u/torstein)\
**Post date:** [May 7, 2026, 7:23pm UTC](https://forum.inductiveautomation.com/t/breadcrumb-in-perspective-module/115443/1 "2026-05-07T19:23:18Z")

</div>

I would like to make an breadcrumb for navigation. I'm building a react component for this so I have the possibility to use the react router data, but it seems that that there isn't much help in that.

For an building management system the breadcrumb may be something like:  
Home \> Building 3 \> Level 2 \> Room 2-12

My idea is to set up the url in a strict matter. Something like  
/building/3/level/2/room/2-12/  
Then the user of the component can make a script to parse the url into parts:

```json
[
  {"label": "Building 3", "url": "/building/3/"},
  {"label": "Level 2", "url": "/building/3/level/2/"},
  {"label": "Room 2-13", "url": "/building/3/level/2/room/2-12/"}
]

```

I'm new to Ignition so I'm not sure if it makes sense to do it like this. Does this require to make a page manually for each rom? Or can UDTs be used?

Thanks for any advices!

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [May 7, 2026, 11:26pm UTC](https://forum.inductiveautomation.com/t/breadcrumb-in-perspective-module/115443/2 "2026-05-07T23:26:00Z")

</div>

Page urls can accept params into them, but usually at the end of the url. Ive never tried inserting them between elements before..

> **[Passing Parameters to Pages​ - Pages in Perspective | Ignition User Manual](https://www.docs.inductiveautomation.com/docs/8.3/ignition-modules/perspective/pages-in-perspective#passing-parameters-to-pages)**
>
> Pages are the main method of navigation in Perspective. When talking about pages, there are two distinct objects to be aware of.

---

<div class="post-metadata">

**Author:** ![adamscadaintegrators](https://avatars.discourse-cdn.com/v4/letter/a/b19c9b/32.png) [@adamscadaintegrators](https://forum.inductiveautomation.com/u/adamscadaintegrators)\
**Post date:** [May 8, 2026, 9:06pm UTC](https://forum.inductiveautomation.com/t/breadcrumb-in-perspective-module/115443/3 "2026-05-08T21:06:05Z")

</div>

You can put multiple input parameters in the Page Configuration. Though, in my experience, you need to be careful about the order in which you create them. You should be able to create just a couple of views (or one single view for all three) to implement this:

```python
/building/:buildingNum/
/building/:buildingNum/level/:levelNum/
/building/:buildingNum/level/:levelNum/room/:roomNum/

```

I use a flex(row) container to display/hide links as a "breadcrumb".

 ![flexHeaderExample](https://us1.discourse-cdn.com/inductiveautomation/original/3X/9/9/995677c62234aea702e4f8ef0605d7974c6fe6c8.png)  
 ![flexHeader](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/8/8872a0a7907d00c2afb820dc614c35691caa8106.png)

---

<div class="post-metadata">

**Author:** ![torstein](https://avatars.discourse-cdn.com/v4/letter/t/f0a364/32.png) [@torstein](https://forum.inductiveautomation.com/u/torstein)\
**Post date:** [May 9, 2026, 5:59am UTC](https://forum.inductiveautomation.com/t/breadcrumb-in-perspective-module/115443/4 "2026-05-09T05:59:07Z")

</div>

Thanks @nminchin and @adamscadaintegrators this seems to work!