I’m happy to release a set of stylesheets for PeopleTools 8.55 for everyone to use. The stylesheets are based on the TANGERINE theme (8.53 look and feel), so they won’t work with Fluid pages. For people who are using the Classic look, these stylesheets are a great way to ensure your users know which environment they are using.

I’ve used stylesheets for pre-8.50 environments from Duncan Davies in the past and built custom stylesheets for 8.53. But with the Branding Framework in 8.54 and 8.55, using custom styles are even easier. Thanks to Sasank Vemana for his great posts on using the Branding Framework as well. I used his posts to build these stylesheets.

Colors

There are six styles in the project. The colors (except the purple theme) are based on the Bootstrap default theme.

Green

Light Blue

Purple

Red

Grey

Yellow

Environments

Use the colors however you want, but the list below is how I’m using the colors:

• DEV1 – Green
• DEV2 – Light Blue
• DEV3 – Purple
• TST – Red
• QA/UAT – Grey
• SBX (Sandbox and Nightly Refresh) – Yellow

Load Stylesheets and Branding Data

You can apply the stylesheets three ways: manually load the project with App Designer and Data Mover, apply a change package with Change Assistant, or follow Sasank’s post and use the stylesheets from the GitHub repository.

App Designer

Download the change package, updIO_STYLES_855.zip, from the GitHub repository. Extract the updIO_STYLES_855.zip file to get the project and scripts. In App Designer, copy the project IO_STYLES_855 from the change package folder into the target database.

Import the ptbr_io_theme.dat file using Data Mover and the script ptbr_theme_io_imp.dms (under updIO_STYLES_855\updIO_STYLES_855_batch\filereferences\scripts).

Run the updateSystemBranding.sql script to update the Branding System Options and insert the IO_LOGO and IO_HDR_BLUE stylesheets.

Change Package

Download the change package, updIO_STYLES_855.zip, from the GitHub repository. Apply the change package against any environment where you want to use the stylesheets. (You’ll need to use the “Apply Updates” mode in newer Change Assistant versions). The change package will import the IO_STYLES_855 project, import the Branding Framework theme data, and update System Branding Options.

Refreshes

If you want to use the styles in your non-production environments, you can import the project and Branding Framework setup and theme data into your production database. Skip the SQL script to update the System Branding Options. Add the SQL commands from the Change Package script updateSystemBranding.sql into your refresh scripts.

8.55 Homepage

After you load the project and run the scripts, Classic pages will show up with the new stylesheest. If you are on 8.55 and want to use the Classic homepage, you’ll need to run the SQL below:

update psuseroptndefn set user_option_value = 'C' where optn_category_lvl = 'PPTL' and useroptn in ('HPPC', 'HPTABLET');

Header Color

To change the header colors, change the Additional Stylesheet on the “PeopleTools > Portal > Branding > Branding System Options” page.

Logo

There are two ways you can replace the logo with your own:

1. Replace the IO_LOGO file under “PeopleTools > Portal > Branding > Branding Objects > Images”
2. Upload your logo as a new image and replace the IO_LOGO reference in the IO_LOGO css file.

Contribute

I have created a GitHub project with the styleets used in the project. If you want to add any changes or suggest improvments, please send them in or contribute to the GitHub repository.