This post is the third part of a blog series on the latest 'Custom Banner/Company Info' configuration that is available via the Branding Framework in PeopleTools 8.57.
Part 1 and Part 2 detailed how we can get started with this functionality and workaround some minor bugs (which require code fixes). This post will detail how we can use the delivered macros and custom CSS to perform simple CSS overrides on the Custom Header.
Environment Used
HCM 9.2 PUM Image 27 originally on PeopleTools 8.56.09 upgraded to PeopleTools 8.57.01 (inaugural Cloud-First release). The PUM image provisioning and upgrade were administered using PeopleSoft Cloud Manager 7 running on Oracle Cloud Infrastructure - Classic.
Using Theme Macro Sets
To use the delivered macros specifically provided for the Company Info functionality, we must use a theme that uses macro sets.
Delivered Macros for Company Info functionality
In Part 1, I created a simple custom theme (CSK_THEME_FLUID) just to get started with the Company Info functionality. The custom theme was cloned from DEFAULT_THEME_FLUID.
Custom Theme from Part 1
Update Custom Theme to use Macro Set
The following custom definitions were created to allow us to utilize Theme Macro Sets.
The custom theme (CSK_THEME_FLUID) was then updated as follows.
More details on Theme Macro Sets can be found in the following references.
Theme Macro Sets to override Branding Elements
PeopleTools 8.57 - Defining Macro Sets and Macros
Changing the Background Color of the CompanyInfo Element
Now that we are setup to use Theme Macro Sets, we should be able to leverage the delivered macros to update some basic style properties. For example, we can use the delivered macro PT_COMPINFO_BACKGROUND to override the background color.
Demo
Consistent CSS for Hyperlinks
As we can see in the demo video above, the hyperlink display appears to be different for Fluid and Classic.
Fluid Company Info - Hyperlink
Fluid Company Info - Hyperlink Hover
Classic Company Info - Hyperlink
Classic Company Info - Hyperlink Hover
Update Custom Classic Theme Style Sheet
Since there are no delivered macros available to override the CSS for CompanyInfo hyperlinks, I updated the custom Classic Theme Style Sheet (CSK_BRAND_CLASSIC_TEMPLATE_857) which we created previously. The following CSS was added to the custom style sheet.
Demo
As we can see in the demo video below, the CompanyInfo hyperlink display in Classic and Fluid is consistent now.
Part 1 and Part 2 detailed how we can get started with this functionality and workaround some minor bugs (which require code fixes). This post will detail how we can use the delivered macros and custom CSS to perform simple CSS overrides on the Custom Header.
Environment Used
HCM 9.2 PUM Image 27 originally on PeopleTools 8.56.09 upgraded to PeopleTools 8.57.01 (inaugural Cloud-First release). The PUM image provisioning and upgrade were administered using PeopleSoft Cloud Manager 7 running on Oracle Cloud Infrastructure - Classic.
Using Theme Macro Sets
To use the delivered macros specifically provided for the Company Info functionality, we must use a theme that uses macro sets.
Delivered Macros for Company Info functionality
In Part 1, I created a simple custom theme (CSK_THEME_FLUID) just to get started with the Company Info functionality. The custom theme was cloned from DEFAULT_THEME_FLUID.
Custom Theme from Part 1
Update Custom Theme to use Macro Set
The following custom definitions were created to allow us to utilize Theme Macro Sets.
Custom Definition
|
Type
|
Cloned From
|
CSK_BRAND_CLASSIC_TEMPLATE_857
|
Style Sheet
|
PT_BRAND_CLASSIC_TEMPLTE_FLUID
|
CSK_BRAND_FLUID_TEMPLATE_857
|
Style Sheet
|
PT_BRAND_FLUID_TEMPLATE_857
|
CSK_DEFAULT_MACROSET_857
|
Macro Set
|
PT_DEFAULT_MACROSET_857
|
More details on Theme Macro Sets can be found in the following references.
Theme Macro Sets to override Branding Elements
PeopleTools 8.57 - Defining Macro Sets and Macros
Changing the Background Color of the CompanyInfo Element
Now that we are setup to use Theme Macro Sets, we should be able to leverage the delivered macros to update some basic style properties. For example, we can use the delivered macro PT_COMPINFO_BACKGROUND to override the background color.
Demo
Consistent CSS for Hyperlinks
As we can see in the demo video above, the hyperlink display appears to be different for Fluid and Classic.
Fluid Company Info - Hyperlink
Fluid Company Info - Hyperlink Hover
Classic Company Info - Hyperlink
Classic Company Info - Hyperlink Hover
Update Custom Classic Theme Style Sheet
Since there are no delivered macros available to override the CSS for CompanyInfo hyperlinks, I updated the custom Classic Theme Style Sheet (CSK_BRAND_CLASSIC_TEMPLATE_857) which we created previously. The following CSS was added to the custom style sheet.
Demo
As we can see in the demo video below, the CompanyInfo hyperlink display in Classic and Fluid is consistent now.
I have a DEMO db using 8.57.05 and FSCM 9.2 and the CompanyInfo Element is missing from DEFAULT_HEADER_FLUID. Is that make sense?
ReplyDeleteHi Sebastian - Yes. I had the same issue initially as well.
DeleteYou need access to 'Company Info Administrator' role. Can you confirm if you have access to this role already? If not, add this role and try again.
More details here:
https://pe0ples0ft.blogspot.com/2018/10/pt857-branding-access.html
Have you been able to change the logo in the header by simply using CSS or macro sets? It seems to only return back an empty background without loading the custom header SVG object.
ReplyDeleteYes. You can use Macrosets to make that happen. The following post describes how we can do this:
Deletehttps://pe0ples0ft.blogspot.com/2016/03/peopletools-855x-branding-part-i-what.html#4
You will need to pay particular attention to how you setup your theme if you are using Macrosets. The details are in step 5.
The same is described in the following PeopleBooks as well:
https://docs.oracle.com/cd/E92519_02/pt856pbr3/eng/pt/tprt/task_AdministeringSystemBranding.html#ua43fb7b9-06dd-4ac1-959f-08b10805acdb
Can you dynamically change the background color based on who you are logged in as?
ReplyDeleteYes. We can do that using role based theme assignments. Check this link:
Deletehttps://pe0ples0ft.blogspot.com/2016/08/peopletools-branding-role-based-themes.html