# Show the current screen button as Active in header

**URL:** <https://forum.inductiveautomation.com/t/show-the-current-screen-button-as-active-in-header/92302>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [June 24, 2024, 8:40pm UTC](https://forum.inductiveautomation.com/t/show-the-current-screen-button-as-active-in-header/92302 "2024-06-24T20:40:40Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jon\_Martin](https://avatars.discourse-cdn.com/v4/letter/j/b782af/32.png) [@Jon\_Martin](https://forum.inductiveautomation.com/u/Jon_Martin)\
**Post date:** [June 24, 2024, 8:40pm UTC](https://forum.inductiveautomation.com/t/show-the-current-screen-button-as-active-in-header/92302/1 "2024-06-24T20:40:40Z")

</div>

I have a header with multiple buttons so I can navigate different screens. I want the current screen button to be active. This is normally very easy with CSS but I am not seeing how to do this in Ignition.

---

<div class="post-metadata">

**Author:** ![leonardo.godoi](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/leonardo.godoi/32/27178_2.png) [@leonardo.godoi](https://forum.inductiveautomation.com/u/leonardo.godoi)\
**Post date:** [June 24, 2024, 8:50pm UTC](https://forum.inductiveautomation.com/t/show-the-current-screen-button-as-active-in-header/92302/2 "2024-06-24T20:50:48Z")

</div>

I have a Session custom property called PrimaryView and every main screen when opened has a script to change that custom property value. On my header i've set up the buttons so that they are shown as active whenever their corresponding PrimaryView is on. Not elegant at all but it doesn't give me problems.

---

<div class="post-metadata">

**Author:** ![Jose\_Rodolfo\_Mutuc](https://avatars.discourse-cdn.com/v4/letter/j/e0b2c6/32.png) [@Jose\_Rodolfo\_Mutuc](https://forum.inductiveautomation.com/u/Jose_Rodolfo_Mutuc)\
**Post date:** [June 25, 2024, 12:09am UTC](https://forum.inductiveautomation.com/t/show-the-current-screen-button-as-active-in-header/92302/4 "2024-06-25T00:09:43Z")

</div>

you can set it on startup script

---

<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:** [June 25, 2024, 5:07am UTC](https://forum.inductiveautomation.com/t/show-the-current-screen-button-as-active-in-header/92302/5 "2024-06-25T05:07:53Z")

</div>

Better to use a binding rather than an event handler if you want to guarantee it's set correctly.

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [June 25, 2024, 8:47am UTC](https://forum.inductiveautomation.com/t/show-the-current-screen-button-as-active-in-header/92302/6 "2024-06-25T08:47:32Z")

</div>

Don't use session customs and scripts for this.

Pages have a `primaryView` property that you can use. Just bind the button's style/class against that property.

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/2/62cd082d3dec4117cec75e400f5bf3c01d9ce402.png)
