Parallax Page Title Bar – Change colour on certain pages

[SamBell]

Hi everyone!

I am working on a project and I was wondering if there is a way to change the page title bar that spans full width to a different colour on only certain pages.

The main colour is a pink colour but on only a few pages, I would like to make it gold.

In this screenshot, you can see the pink bar that says 'START HERE' - It is this bar on only the ELITE pages that I would like to turn gold. On all other pages I want it to be left pink.

I am unable to give you the URL as this is a membership site and you'd need to register to see the pages in question anyway. Hopefully the screenshot will suffice!

Any suggestions or is this too much of a long shot!?

http://i79.photobucket.com/albums/j155/sambellcreative/Screen%20Shot%202015-02-24%20at%201.09.34%20pm_zpsluzykddj.png

[Lauren @ OnceCoupled]

Pages have unique body classes you could use to accomplish this. Using your browser inspector to find the proper class for each, you'd have something like:

.page-id-2690 .title-bar,
.page-id-150 .title-bar {
     background-color: gold;
}

Alternatively, you could apply a special class to these pages, and then use something simpler like:

.elite-page .title-bar

http://my.studiopress.com/snippets/custom-body-class/

Best,
Lauren

---

We create mobile-first, PageSpeed-optimized, pixel-perfect custom themes! https://www.oncecoupled.com

[SamBell]

Oh of course! Thank you that was really helpful!

[Author]

Posts