# Per Page Color Settings

**URL:** <https://forums.knack.com/t/per-page-color-settings/7129>\
**Category:** Ask Developers\
**Created:** [April 3, 2018, 4:03pm UTC](https://forums.knack.com/t/per-page-color-settings/7129 "2018-04-03T16:03:19Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![SteveMille99168](https://avatars.discourse-cdn.com/v4/letter/s/71c47a/32.png) [@SteveMille99168](https://forums.knack.com/u/SteveMille99168)\
**Post date:** [April 3, 2018, 4:03pm UTC](https://forums.knack.com/t/per-page-color-settings/7129/1 "2018-04-03T16:03:19Z")

</div>

Hi Folks.

I'm terribly unskilled at css or js but I'd really like to be able to set the Banner and Buttons as different colors on _some_ of my pages.

I've tried some attempts at CSS in the builder but I cannot get the coding correct.

---

<div class="post-metadata">

**Author:** ![Johnny\_Appknowledged\_UK](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/johnny_appknowledged_uk/32/2898_2.png) [@Johnny\_Appknowledged\_UK](https://forums.knack.com/u/Johnny_Appknowledged_UK)\
**Post date:** [April 3, 2018, 8:44pm UTC](https://forums.knack.com/t/per-page-color-settings/7129/2 "2018-04-03T20:44:29Z")

</div>

[jonathan.mart.parson@gmail.com](mailto:jonathan.mart.parson@gmail.com)

---

<div class="post-metadata">

**Author:** ![Johnny\_Appknowledged\_UK](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/johnny_appknowledged_uk/32/2898_2.png) [@Johnny\_Appknowledged\_UK](https://forums.knack.com/u/Johnny_Appknowledged_UK)\
**Post date:** [April 3, 2018, 8:43pm UTC](https://forums.knack.com/t/per-page-color-settings/7129/3 "2018-04-03T20:43:31Z")

</div>

Hi Steve,

This is a bit tricky, to be honest the header does not render with each page. If you look when you load the page the header remains the same whilst the content of the page loads.

Can possibly look into doing this with some javascript but not to sure on the results. However if you want to explore this or go through any other customizations then I can go through some things with you.

ping me an email and I can see what I can do for you

jonathan.mart,[parsons@gmail.com](mailto:parsons@gmail.com)

---

<div class="post-metadata">

**Author:** ![SteveMille99168](https://avatars.discourse-cdn.com/v4/letter/s/71c47a/32.png) [@SteveMille99168](https://forums.knack.com/u/SteveMille99168)\
**Post date:** [April 3, 2018, 7:51pm UTC](https://forums.knack.com/t/per-page-color-settings/7129/4 "2018-04-03T19:51:13Z")

</div>

Yep! The "AutoHouse Automotive" red banner. Sometimes I want it to be blue.

---

<div class="post-metadata">

**Author:** ![Johnny\_Appknowledged\_UK](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/johnny_appknowledged_uk/32/2898_2.png) [@Johnny\_Appknowledged\_UK](https://forums.knack.com/u/Johnny_Appknowledged_UK)\
**Post date:** [April 3, 2018, 7:49pm UTC](https://forums.knack.com/t/per-page-color-settings/7129/5 "2018-04-03T19:49:55Z")

</div>

No problem and Apologies I thought you meant the submit buttons on the forms. Ok so If I have got this right you want to change the color of the main menu nav bar at the top in red based on the page your on?

---

<div class="post-metadata">

**Author:** ![SteveMille99168](https://avatars.discourse-cdn.com/v4/letter/s/71c47a/32.png) [@SteveMille99168](https://forums.knack.com/u/SteveMille99168)\
**Post date:** [April 3, 2018, 7:40pm UTC](https://forums.knack.com/t/per-page-color-settings/7129/6 "2018-04-03T19:40:39Z")

</div>

Hi Johnny.

Thanks very much for the help. I mean the first header (banner) of each page. its currently the same on every page in my app. Pic below.... I put the code you suggested on my CSS tab, and filled in the scene# as reported by the builder but no love. still red.

 ![](https://support.knack.com/hc/user_images/IGIHbizin7x9FbLfHf1Rtw.png)

---

<div class="post-metadata">

**Author:** ![Johnny\_Appknowledged\_UK](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/johnny_appknowledged_uk/32/2898_2.png) [@Johnny\_Appknowledged\_UK](https://forums.knack.com/u/Johnny_Appknowledged_UK)\
**Post date:** [April 3, 2018, 6:41pm UTC](https://forums.knack.com/t/per-page-color-settings/7129/7 "2018-04-03T18:41:15Z")

</div>

Sorry I think you meant the menu buttons with the banner right. I've done a custom job with mine like this

 ![](https://support.knack.com/hc/user_images/0UTEYvS1V35_Pqw7diSRPQ.png)is this what you meant

---

<div class="post-metadata">

**Author:** ![Johnny\_Appknowledged\_UK](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/johnny_appknowledged_uk/32/2898_2.png) [@Johnny\_Appknowledged\_UK](https://forums.knack.com/u/Johnny_Appknowledged_UK)\
**Post date:** [April 3, 2018, 5:39pm UTC](https://forums.knack.com/t/per-page-color-settings/7129/8 "2018-04-03T17:39:36Z")

</div>

Hi Steve,

Hope you're good the following code will work for buttons however you will need to select the scenes and fields you want this to work with. Where I have put the ?? you will need to add the scenes that you want to change the colour of the buttons for.

.is-primary {  
background-color: blue !important;  
}

#kn-scene\_?? .is-primary {  
background-color: blue !important;  
}

You can do some mad stuff with CSS so if you want to know anything else then just let me know.

Johnny

[jonathan.mart.parsons@gmail.com](mailto:jonathan.mart.parsons@gmail.com)
