Sasank's PeopleSoft Log: PeopleTools 8.54 - Branding

Sunday, November 23, 2014

PeopleTools 8.54 - Branding - Part 1

PeopleTools 8.54 is here! Well it has been out for the past few months. I finally managed to get a VM Instance up and running.

I have been working on Branding PeopleSoft Applications starting from 8.48 and was naturally interested in finding out the new configuration, functionality and features that 8.54 has to offer. As you all know, Branding in PeopleTools has slowly evolved with new styles like SWAN and TANGERINE. I was interested in exploring how it has changed with 8.54 and what it might take to do some custom Branding that most organizations would like to perform at a very basic level.

This post (followed by a few more parts as time permits) is intended to detail my findings while branding a PeopleSoft Application on PeopleTools 8.54.

First thing I noticed with PeopleTools 8.54 is that the PeopleTools Options Page does not allow us to update the Branding App Package and Default Style Sheet any longer.

Notice how the Default Style Sheet, Branding Application Package and Application Class are all disabled? So where do we change this now in 8.54?

PeopleTools > Portal > Branding > Branding System Options

The original branding options (that we are used to from pre 8.54 tools) can be found on this page. And technically we could just customize these options (Default Style Sheet, Package Name and Application Package) similar to prior PeopleTools versions and be done with it from a branding point of view. But let us explore the other configuration items that are available online as part of PeopleTools 8.54.

The Default Branding Theme appears to be at the highest level amongst all configurable options on the Branding System Options page. So let us start by creating a custom Branding Theme similar to DEFAULT_THEME_TANGERINE.

PeopleTools > Portal > Branding > Assemble Themes
- Search for DEFAULT_THEME_TANGERINE.
- Save As a custom theme.
- In my example, I am calling my custom theme CSK_THEME_TANGERINE. CSK is my favorite cricket team in the IPL!!

If we go back to the Branding System Options then we would now see the new custom theme in the drop down for Default Branding Theme.

Let us go ahead and select this new theme as the Default Branding Theme and save the Branding System Options (so we can customize it accordingly).

Let us now start customizing our Branding Theme (custom copy) step by step.

First item on everyone's list would be to get rid of the Oracle logo and use a custom logo. In previous PeopleTools versions, we would have uploaded our custom logo image using Application Designer and then modified the style sheet (e.g.: pthdr2logoswan) that references the logo image accordingly.

With PeopleTools 8.54, we can upload our custom logo (image) and style sheet objects using the following page:
PeopleTools > Portal > Branding > Branding Objects

I uploaded my custom logo and custom stylesheet that I would like to use for overriding the delivered style.

Image Screenshot:

For simplicity sake, I resized my custom logo to the same height (55) as the delivered Oracle logo.

Style Sheet Screenshot:

Notice that I have referenced the custom logo in my style class as follows:
content: url(%Image(CSK_LOGO));

Note: Objects uploaded via the Branding Objects page would be created as PeopleTools managed objects in the database meaning that we can view and migrate them using App Designer.

Now that we have the necessary objects for customizing the logo, let us see how we can apply them to our custom branding theme.

We will perform this task by using the Assemble Themes page.

PeopleTools > Portal > Branding > Assemble Themes
- Search for our custom theme (CSK_THEME_TANGERINE)

We can see that on this page we can assemble a theme by associating several configurable items most notably the Homepage Header and Footer. As the custom theme is still a copy of the delivered theme, it is referencing the delivered Homepage Header and Footer properties.

Let us create a custom Homepage Header and then associate it with the custom Theme.

PeopleTools > Portal > Branding > Define Headers and Footers

On this page we can see that each of the DIV elements on the header are represented in a tree structure. Here a branch/folder represents a logical container and the leaves represent the DIV elements.

Tree Structure:

Corresponding DIV elements:

Other notable features on the Define Headers and Footers page are the Preview and Style Definitions Options. The Preview option can be used to visually identify the location of each of the folders/containers and leaves in the tree. The Style Definition is available to enter any additional free form style class definitions.

Let us use this delivered Header definition (DEFAULT_HEADER_TANGERINE) to 'Save As' a custom Header (CSK_HEADER_TANGERINE).

On the custom Header definition (CSK_HEADER_TANGERINE) let us delete the pthdr2logoswan element under pthdr2container (we will be replacing this with our custom DIV element).

Now let us add a new child element under pthdr2container as follows:

Note:
- Make sure the order of the new element is '01 - First'.
- The properties and attributes of this DIV element (cskhdrlogo) were cloned from pthdr2logoswan.

Our custom header is now ready with the updated logo:

Let us now go back to 'Assemble Themes' and update our custom Theme (CSK_THEME_TANGERINE) to reference our custom Homepage Header definition (CSK_HEADER_TANGERINE):

Last but not the least, we will update the 'Branding System Options' to add our custom style sheet object:

Now we are ready to test our changes.

Note: Please shutdown, purge cache and reboot your web server before continuing to test.

Test Screenshots:

Just like that we were able to apply a custom logo to the Application on PeopleTools 8.54:
- Without any customizations.
- Without using Application Designer (completely configurable).

In the next part, I would like to experiment with customizing the background color and the font color of the Drop Down Menu (ptdropdownmenu) and the Header Container (pthdr2container). Stay tuned!

Note:
- This post is based on my recent experiments with PeopleTools 8.54 and there could be more efficient ways of doing the same. I welcome all feedback and suggestions and would be more than happy to update this post if any improvements could be made. Again, the intent of this post is to create a quick reference/starter guide for anyone who wants to brand PeopleTool 8.54+ applications.
- This exercise was done based on HCM 9.2 PUM Image 8 (PeopleTools 8.54.01).
- If you find the images are small for viewing then just click on them to view in full size.

Updated related branding articles list on August 26th, 2017:

Index of blog posts on PeopleTools Branding:

Customizing DEFAULT_THEME_TANGERINE Theme (continuation of this post):
PeopleTools 8.54 Branding - Part 2
PeopleTools 8.54 Branding - Part 3

Customizing DEFAULT_THEME_TANGERINE_ALT Theme:
PeopleTools 8.54+ Branding - Part 4A
PeopleTools 8.54+ Branding - Part 4B
PeopleTools 8.54+ Branding - Part 4C
PeopleTools 8.54+ Branding - Part 4D
PeopleTools 8.54+ Branding - Part 4E

PeopleTools Fluid Branding:
PeopleTools 8.54+ Branding - Part 5A
PeopleTools 8.54+ Branding - Part 5B
PeopleTools 8.54+ Branding - Part 5C
PeopleTools 8.54+ Branding - Part 5D

PeopleTools 8.55.x Branding:
Part I - What has changed?
Part II
Part III - Custom Macros and More

PeopleTools 8.55.x - Using Oracle JET:
Part 1
Part 2
Part 3
Part 4

PeopleTools 8.56 - Branding Review

PeopleTools 8.57 | Branding Administration Access and New Roles
PeopleTools 8.57 | Getting Started with Custom Banner aka Company Info Configuration
PeopleTools 8.57 | Custom Banner/Company Info Configuration - Part 2
PeopleTools 8.57 | Custom Banner/Company Info Configuration - Part 3
PeopleTools 8.57 | Custom Banner/Company Info Configuration - Part 4

JavaScript Injection Framework:
Global JS Injection Framework
Java Script Injection Framework - Updates, Bugs and Fixes

Miscellaneous Topics:
Component Branding
PeopleTools 8.54 Branding Objects - Migration Issue and Workaround
Branding Header Definition - Steps to add external link to System Header Links (Open in New Window)
PeopleTools 8.54+ FavIcon for Classic
PeopleTools 8.54+ Role Based Theme Assignment/Override
Using ACE Editor for Online Branding Objects (HTML, JavaScript and Style Sheets)
PeopleTools 8.55 - Fluid UI - Drop-Down Menu/Breadcrumb Navigation vs NavBar/Navigator Conundrum
Fluid UI - New Window Feature - Workaround
Using Different Branding Themes for Different Portals
PeopleTools 8.55+ Branding - Using the Logo as a Hyperlink
Fluid Global Search - Setting Focus on the Search Box
Adding Userid to 'Sign out' Action Menu Item Label
PeopleTools 8.55+ Branding | Conditionally Display Header Icons
Adding Custom Links to Action Menu using DoURLWarning JavaScript Function
Decoupling the 'Add to' Homepages, Favorites and NavBar Functionality
Classic/Fluid Home NavBar Tiles
Enable/Disable Classic Plus with Customizations

78 comments:

Sasank VemanaNovember 29, 2014 at 12:51 PM
Added links to part 2.
ReplyDelete
Replies
Sasank VemanaDecember 31, 2014 at 12:55 PM
Part 2: http://pe0ples0ft.blogspot.com/2014/11/peopletools-854-branding-part-2.html
Part 3: http://pe0ples0ft.blogspot.com/2014/12/peopletools-854-branding-part-3.html
ReplyDelete
Replies
AnonymousJanuary 22, 2015 at 12:05 PM
Hi Sasank,

Great posting. very hands on and contains great info. I have several questions:

1. You mentioned "The properties and attributes of this DIV element (cskhdrlogo) were cloned from pthdr2logoswan", how do do I that? I don't see any of the attributes in the page. I am using HCM 9.2 PUM Image 9 on PT8.54.03.

2. If I plan to change the greeting text with the USERID and DB Name without using App Designer App Package, how do I use this custom header to acheivve that?

Thanks for your help.

Y1
ReplyDelete
Replies
AnonymousJanuary 22, 2015 at 1:29 PM
Hi Sasank,

I saw your posting #3 with the Greeting Text. I will try to follow that. If you could let me know how to clone the properties and attribute for this "DIV", I appreciate your help.

Thanks,
Y1
ReplyDelete
Replies
Sasank VemanaJanuary 22, 2015 at 8:45 PM
@Y1 - Thanks for the feedback! Glad to hear that the post was helpful.

1. The series of screenshots prior to my statement "The properties and attributes of this DIV element (cskhdrlogo) were cloned from pthdr2logoswan." should give you the steps to clone your custom element (similar to cskhdrlogo) from pthdr2logoswan. The cloning is not a delivered function, I did it manually.
- Firstly, I deleted pthdr2logoswan.
- Then I clicked on pthdr2container and used the 'Add Child' Button.
- Added the Child Element 'cskhdrlogo' setting the type to 'BasicHTML'.
- Then I added the element properties (style, parent, Order).
- Lastly, clicked on the 'Additional Options' Link and entered the 'Static HTML' value.

2. You are right. You can leverage the details in Part 2, Part 3 and improvise the Greeting Text without having to use the App Class approach. You can follow a similar approach of how I displayed the DB Name in Part 2 using meta-html. You can use %dbname and %userid meta-html values. You can find more details on meta-html here:
http://docs.oracle.com/cd/E13292_01/pt849pbr0/eng/psbooks/tpcl/book.htm?File=tpcl/htm/tpcl04.htm

Let me know if you have any other questions. I would be happy to help where I can!
ReplyDelete
Replies
Sasank VemanaJanuary 23, 2015 at 12:30 PM
@Y1 - Yes. You are right we need to have the style class defined first before you do the steps to add the cskhdrlogo.

I used basic html in my example but you should be fine to use even the Basic Image if that works for you. The reason for using basic html was to further expand it (you will see that in Part II) where I converted the image to a hyperlink using an anchor tag in the html.

Does that answer your question?
ReplyDelete
Replies
TimJanuary 26, 2015 at 11:05 AM
Sasank,
When you say "Note: Please shutdown, purge cache and reboot your web server before continuing to test," what do you mean by shutdown and purge cache? Shut down my browser or one of our servers (app or web)? Also, for purging cache, is that the browser's cache or one of the server's caches (app or web)?

Thanks!
ReplyDelete
Replies
Sasank VemanaJanuary 26, 2015 at 12:54 PM
@Tim,

By "Note: Please shutdown, purge cache and reboot your web server before continuing to test", I mean the web server. We need to do that to avoid stylesheet caching issues at the web server level.

So basically, shutdown the web server using PS Admin, delete/purge the cache folder on the web server and reboot the web server again using PS Admin. This generally gives me the best results. Here is a quick post of how to clear web server cache if you are using a locally installed PUM Image.
http://pe0ples0ft.blogspot.com/2014/11/peoplesoft-pum-image-virtual-machine.html

Additionally, if you are still experiencing caching issues, then yes, clearing user's browser cache also helps (because sometimes the javascripts, stylesheets that are cached on the user's browser might also get stale particularly when we are constantly making changes during development/testing phases).

Thanks!
ReplyDelete
Replies
AnonymousJanuary 27, 2015 at 1:09 PM
Sasank,

I am still having problem with the image and custom stylesheet, I saw your posting #2 has the CSS for cskhdrlogo, I copied that into my environment but still not able to display it. I cleared web server, app server, browser cache, no go.

So I have to stick with basic image type to display the logo. So I have the workaround and it's fine.

Now I want to use DEFAULT_THEME_TANGERINE_ALT to make the header like the new FLUID theme. I used similar steps, created my own custom theme, custom stylesheet and attached the logo as basic image. but then the logo showed up in the center and not at the left corner. Which section in the stylesheet DEFAULT_THEME_TANGERINE_ALT drives the position of the logo? I can see it has the text-align center but does this impact the logo?

Thanks,
Y1
ReplyDelete
Replies
Sasank VemanaJanuary 28, 2015 at 12:04 PM
@Y1 - The basic HTML should work. I have used it on two different applications. But if the basic image is working better for you then that should do!

With regards to DEFAULT_THEME_TANGERINE_ALT: Good question! I have not played with that theme or FUILD much but I am assuming that the 'overriding style process' would be the same. It should begin with identifying the current style that is being used by the element (using tools such as firebug) and then appropriately overriding the style.

I tried the following and it seems to align to the left:
- Clone DEFAULT_THEME_TANGERINE_ALT (theme) and give it a custom name.
- Clone DEFAULT_HEADER_TANGERINE_ALT (header) and give it a custom name.
- Reference the custom header in the custom theme.
- Update the custom header to reference a custom Basic HTML with custom style.
- Override style.

Review below link for screenshots:
http://pe0ples0ft.blogspot.com/p/test.html

What are you seeing in the style when you debug the element on the browser?
ReplyDelete
Replies
AnonymousJanuary 30, 2015 at 11:27 PM
Sasank,

Finally I got it. I reviewed your posting #2 several times and finally understood that the custom stylesheets need to be added to the branding system options first, then when referred in the custom header, it did show up. Finally got it to work. Thanks so much for such detail steps. Now the other theme also works...

Next item for me is to display DB Name with User Name, I followed your steps in posting #2, managed to use Java Script Object with %userid and %dbname, also got it to display. But there is a big gap between the logo and the text string, I tried to change the CSK_BR_GEN CSS but still can't get it to work. I changed the text-align, margin but still didn't get it to work. Would you be able to show it to me?

Also, for our non-production environment, we want to append another custom value from the URL string to the %userid and %dbname. For example, we created DB_REFRESH_DATE in URL maintenance and set the value 2015-01-12. Is there a way I can use %URL to get the value out then append to the text string so the Java Script can display it?

Thank you...

Y1

ReplyDelete
Replies
AnonymousFebruary 18, 2015 at 11:25 AM
Hi Sasank,

Thanks for the terrific tutorial.

We recently upgraded a copy of our database from Tools 8.53 to 8.54.05 for developers to explore the new Tools version. I’ve been following your guidelines (peopletools-854-branding-part-1.html) for replacing the Oracle logo with a custom logo for display within the Homepage Header defn.

I am able to successfully display my custom logo within my custom header defn via the Preview option on the Define Headers and Footers page, but on the “real” homepage header, the Oracle logo continues to display.

I’ve cleared web server cache and bounced the webserver (there’s just one for this environment) multiple times, and repeatedly reviewed my setup to make sure I updated all the necessary references to point to my custom defns prior to bouncing. I even went so far as to delete all the custom objects I created (my clones of DEFAULT_THEME_TANGERINE and DEFAULT_HEADER_TANGERINE, as well as the custom Image and Stylesheet defns I uploaded / added), clear cached / bounce web server again, restarted from scratch and recleared cache / bounced server again after I could see the custom logo via the Preview option… and still ended up with the same problem.

In reviewing your post, I looked carefully at slide #7 and did a line-by-line compare of the html shown in your screen shot for the "Define Headers and Footers" page as loaded with the delivered "DEFAULT_HEADER_TANGERINE" defn (i.e. where you discuss the pre-modified definition).

I notice some discrepancies and am wondering if they might provide a clue to my problem. [Note I’m using the "Inspect Element" tool -- available in Firefox when you right-click a page -- to examine the html. FF is version 35.0.1., running on Windows 7 Enterprise.]

I was going to include a screen shot, but I see I can only upload text comments, so I've entered the relevant part below. Note I inserted some blank spaces inside the html tags so they would upload to you without being rejected.

================

[...] (same as your screenshot up until just after the first "< div>< /div>" element, which is where I start below)

< div>< /div>
< !-- Begin pagelet: UniversalNavigation URL: https%3%2... -->
< div class="ptprtlcontainer">
< div id="ptifrmpopup" style="display:none;">< /div>
< header id="pthdr2container" aria-label="Universal Navigation Header" role="Banner" >
< table id="pthdr2table" width="100%" cellspacing="0" cellpadding="0" border="0" >
< tbody>
< tr>
< td width="113" align="left">
< div id="pthdr2logoswan"> < /div>
< /td>

[ ... ]

================

The html matches yours up until the "< !-- Begin pagelet: ...> comment line. Most noticable to me was the absence of a < div id=”DEFAULT_HEADER_TANGERINE” class=""> element for my page’s html.

Any guidance / suggestions will be greatly appreciated!

Thanks,

Anne
ReplyDelete
Replies
Sasank VemanaFebruary 20, 2015 at 12:24 PM
@Anne - Thanks for your comments. I got an email notification of your question but I don't seem to find it here on this post (it might be because of the html you tried to paste).

It is a bummer that blogger does not allow images in the comments. Would you be able to share the screenshot by hosting it online? Perhaps you could try http://snag.gy/

I have one suggestion for your problem because I was recently helping someone who had a similar issue.

Can you check if you have customized your delivered app package PTBR_BRANDING or html objects (i.e.: brought forward any previous custom changes as part of retrofitting)? This could be the cause of your problem. I would suggestion that you revert all customizations that were made prior to starting with the steps that I have detailed.

Along the same lines, another suggestion would be to test the logo change on your demo 8.54.05 instance. That might give you some clues to identify any potential issues with your upgraded environment.

Thanks!
ReplyDelete
Replies
selvakumarJuly 14, 2015 at 10:33 PM
This comment has been removed by the author.
ReplyDelete
Replies
RichardJuly 30, 2015 at 4:21 PM
Hi Sasank,

Is there a way to customize the login page using configuration similar to branding on the header?

Thanks
ReplyDelete
Replies
Tom MannancheryAugust 31, 2015 at 6:06 PM
Excellent post Sasank.. Way to Go! :)
ReplyDelete
Replies
RyanSeptember 4, 2015 at 8:59 AM
Does it work in IE for you? We implemented sililar stuff (i.e. adding logo, adding some text to the right end on the menu bar). It works fine on Chrome, but in I.E. there is a white line to start off the page. And the global search bar's links don't work (dropdown, search button)

Thanks,
ReplyDelete
Replies
RL MyersNovember 6, 2015 at 12:42 PM
The logo I uploaded in 8.53 tools is off when I upload it to 8.54 tools. It's exactly the same image but now it's displaying about 1/4 inch below and covers the head line. Any idea why that would be? No other modifications were made.
ReplyDelete
Replies
UnknownNovember 13, 2015 at 3:53 PM
Hi Sasank,

I got my hands on an 8.54 Interaction Hub PUM image a few weeks ago and the first thing I noticed was how much the branding framework had changed from how it is in 8.53. The tree structure was pretty confusing but going through this series of posts was extremely enlightening. Thanks for doing this!
ReplyDelete
Replies
AnonymousJanuary 14, 2016 at 12:01 PM
Hi Sasank,

Thanks for your post regarding branding.

Could you please let me know how to change the logo in Peoplesoft Login page.

Thanks.

ReplyDelete
Replies
AnonymousJanuary 14, 2016 at 1:47 PM
I am able to change it now.

Thanks.
ReplyDelete
Replies
kishorJanuary 30, 2016 at 12:45 PM
anna please post information on internetportals.and how to give interconnection between peoplesoft in websites
ReplyDelete
Replies
kishorJanuary 30, 2016 at 12:46 PM
and pagelets and templates
ReplyDelete
Replies
tsswamyFebruary 3, 2016 at 8:10 AM
Hi Sasank,

Lot of information about branding branding. Can you guide me how to change the default text color of the peoplesoft page.

-Regards
Swamy
ReplyDelete
Replies
AnonymousFebruary 22, 2016 at 5:29 PM
How do you change the default style sheet based on which web profile you are accessing? We have 4 different web profiles running under one instance. Branding just lets you change it for one web profile. I want to dynamically change it depending on which profile I accessed. So using your example above I can replace the Oracle logo with 4 different values depending on which profile I logged in through.
ReplyDelete
Replies
AnonymousFebruary 23, 2016 at 7:22 AM
Yes, all 4 use different URL's. In the past we modified the PT_Branding app package. We were just wondering if we could let those customs go and just use branding. Seems I need to modify PTBR_Branding now.
ReplyDelete
Replies
AnonymousFebruary 27, 2016 at 12:58 PM
Followed everything you recommended and it all worked great. Thank you. Another question, rather than having to control each element in Branding based on the login URL would there be anyway to change the default branding theme upon login? This way I could just build a default theme for each of my sites and swap them in and out depending on the login URL.
ReplyDelete
Replies
AnonymousFebruary 27, 2016 at 1:21 PM
Actually found what I was looking for. You can use Assign Themes to override the default theme based on the portal logged into.
ReplyDelete
Replies
Sasank VemanaFebruary 27, 2016 at 2:05 PM
Glad you did! I was going to ask if the portals will be different for each of your web profiles, if so then the Assign Themes would be your ideal solution!

I just saw that I previously mentioned that in response to your first comment but we got side tracked with the dynamic logo override option. :)

In case, we had been in a situation where all four web profiles used the same portal (which is a possible scenario) and if we are not averse to customizing then we could write some dynamic logic on the getCurrentThemeAssignmentForPortal method under PTBR_BRANDING.BrandingManager.OnExecute. Just wanted to mention that as a worse case scenario workaround.

Again, I am glad you have separate portals so you are actually leveraging the Assign Themes functionality! :)
ReplyDelete
Replies
AnonymousMarch 16, 2016 at 3:12 PM
Hi Sasank,
Really helpful blog. It worked really well! However, the logo changes depending on the %DBNAME. You said something about putting it in basic html but unsure how all the pieces fit together Css/HTML/Javascript within the branding Can you suggest how to do that? Thanks!
ReplyDelete
Replies
TitooMarch 17, 2016 at 5:41 AM
A very well done explanation of branding changes. Easy to follow and thorough.
ReplyDelete
Replies
AnonymousApril 28, 2016 at 8:36 AM
Hi Sasank,
Very nice info you've got here :)
Do you, by chance, know the answer to the following 2 questions :
1. after restart of WebServer (clear cache too), when log-in first time in PS in the cache directory a couple of .css files are generated. Do you know based on what are they generated? I did modify in App Designer a class from the default stylesheet and in the .css I find 2 entries for this class : one mine from App Designer and another from I don't know where. And this second has a different color which overwrites my color from App Designer.
2. How could we migrate to next environment a Header/Footer defined in Web and which also contains a Basic HTML element (HTML code which is accessed via hyperlink Additional Options, Static HTML field)
Thank you very much
ReplyDelete
Replies
AnonymousApril 28, 2016 at 10:19 AM
My PS_PTBR_OBJECT_TBL table is empty, as I modified the class properties in App Designer.
1. I copied the standard PTSTYLEDEF_TANGERINE and created a CUST_PTSTYLEDEF_TANGERINE_92.
2. Here I modified multiples classes, one of which is PSSRCHRESULTSHDR (here I modified the font to White).
3. Setup this stylesheet as default on the theme.
4. Restarted Webserver + cleared cache
5. After longin, in the CUST_PTSTYLEDEF_TANGERINE_92_148.css from the cache, there are 2 entries :

.PSSRCHRESULTSHDR{font-family:Verdana,Arial,sans-serif;font-size:9pt;font-weight:bold;font-style:normal;color:rgb(255,255,255);background-color:rgb(88,29,116);}

and somewhere below :

.PSSRCHRESULTSHDR:link, .PSSRCHRESULTSHDR:visited {
border-style: none;
color: #426a92;
font-family: Arial,sans-serif;
font-size: 8pt;
font-weight: bold;
}

6. When I havigate to a search page and search for some data, the color of the text from the header is #426a92 and not white. Looked in the PSSTYLECLASS table and updated all classes so no more color 9595458 is present, but after restart/clear of cache, the same .css is created.
Also I found some comments in this .css, like :
// min-width doesn't work in IE. This is a hack to ensure that when Row labels have a minimum width of 70px.

but didn't find this on unix server (webserv directory) not in the PeopleCode (thought it's generated by an App Package - PTBR_BRANDING) but no luck.
If I knew who generates this .css, I'd see what additioanl changes I have to made

Thank you for your help Sasank!
ReplyDelete
Replies
AnonymousApril 28, 2016 at 10:45 AM
Solved - the PTSTYLEDEF_TANGERINE StyleSheet contains also some FreeForm Sub StyleSheets, one of which is PTPUSHBUTTON_CSS3 and here we find the overriding of PSSRCHRESULTSHDR defined in PSSTYLEDEF_TANGERINE.
Thanks again and have a good one Sasank!
ReplyDelete
Replies
Sasank VemanaApril 29, 2016 at 7:38 AM
Great! Glad you figured it out. What tools version are you on and what delivered theme did you clone?

I was going to suggest that you might want to look at PTSTYLEDEF_TANGERINE (Style Sheet) > PSSRCHRESULTSHDR (Style Class - Fixed Form) > Go to the Miscellaneous Tab > Under Pseudo Classes - Look at the classes defined for Link and Visited > They are pointing to PSSRCHRESULTSHDRTXT which is also part of PTSTYLEDEF_TANGERINE.

Anyway, all that said, I am glad you got it working. I would suggest that you take a look at my second post (see link below). Instead of directly updating the style sheet on the theme or Branding System Options (to point to your custom styles), I would suggest that you let your custom theme use the delivered style sheet. You can then override just the styles that you want to change using the "Additional Style Sheet Objects" grid on Branding System Options). That way, you are still using the delivered styles for the most part (and any new updates that might come through as part of your tools patching/upgrades) and at the back end you will just overlay your custom styles.

Thanks!
http://pe0ples0ft.blogspot.com/2014/11/peopletools-854-branding-part-2.html
ReplyDelete
Replies
AnonymousJuly 26, 2016 at 4:27 PM
Hi Sasank,

This is really terrific information. Thanks for sharing it to us.

Today, i did some configuration stuff in My Page Dashboards & Learning Home Dashboards in ELMS v9.2 and PeopleTools v8.54. I have selected required pagelets and pagelet option as REQUIRED. When i have moved on to TAB LAYOUT in Structure & Content page and did the alignment of those pagelets. I am not able to see same alignment of those pagelets when i login as Employee or Manager. Infact i can seel all the pagelets which are listed but the alignment is not as per the setup i did. I have cleared Web Server Cache & Bounced it. I have cleared CACHE in my system in all browsers as well. Still alignment looks question mark. Kindly help in resolving this issue?
ReplyDelete
Replies
AnonymousJuly 27, 2016 at 1:39 PM
Sasank, Thanks for detailed post. Helped to display custom logo in 8.55.05 database. Kudos. Gautam
ReplyDelete
Replies
AnonymousNovember 9, 2016 at 8:45 AM
I have a page with an HTML object and I am trying to change the font through Component Branding. I added this:
.PSHYPERLINK{
color:#ff0000;
}
to the custom style sheet. But its not changing it in the HTML Area. Can you override a HTMLAREA on a page?
ReplyDelete
Replies
Karmveer SoniJune 22, 2017 at 2:19 AM
Great blog. Thanks Sasank!
ReplyDelete
Replies
WillJuly 31, 2017 at 10:22 AM
Seems Like with 8.55.16 I am getting the following errors in Work Lists
PT_COMMON_MIN_57.js:2032 Uncaught TypeError: Cannot read property '1' of null
at getScriptUrl (PT_COMMON_MIN_57.js:2032)
at PT_COMMON_MIN_57.js:2073
at PT_COMMON_MIN_57.js:2073
PT_COMMON_MIN_57.js:2032 Uncaught TypeError: Cannot read property '1' of null
at getScriptUrl (PT_COMMON_MIN_57.js:2032)
at PT_COMMON_MIN_57.js:2073
at PT_COMMON_MIN_57.js:2073
PT_COMMON_MIN_57.js:2032 Uncaught TypeError: Cannot read property '1' of null
at getScriptUrl (PT_COMMON_MIN_57.js:2032)
at PT_COMMON_MIN_57.js:2073
at PT_COMMON_MIN_57.js:2073
PT_COMMON_MIN_57.js:6817 Uncaught TypeError: Cannot read property 'classicBackButton' of undefined
at AddToHistory (PT_COMMON_MIN_57.js:6817)
at WORKLIST:1304
PT_PAGESCRIPT_win0_MIN_17.js:1158 Uncaught TypeError: Cannot read property 'classicBackButton' of undefined
at UpdateBreadCrumbs (PT_PAGESCRIPT_win0_MIN_17.js:1158)
at HTMLDocument.onLoadExt_win0 (WORKLIST:218)
at init (PT_COMMON_MIN_57.js:1374)
at handle (PT_COMMON_MIN_57.js:1478)
at element.handle (PT_COMMON_MIN_57.js:1413)
PT_AJAX_NET_MIN_17.js:145 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
(unknown)
Object
(unknown)
Object
PT_PAGESCRIPT_win0_MIN_17.js:1259 Uncaught TypeError: Cannot read property 'getStoredData' of undefined
at preSubmitProcess_win0 (PT_PAGESCRIPT_win0_MIN_17.js:1259)
at submitAction_win0 (WORKLIST:119)
at :1:1
ReplyDelete
Replies
RajaFebruary 8, 2018 at 2:59 AM
Hello Sasank,

Thanks for the wonderful posts regarding fluid and it is really helpful in many ways. Also, I do have a requirement in peopletools 8.54, which is to redirect to fluid sigon page when we are accessing from mobile and classic sign on page when we are accessing from desktop. Currently we are able to do it by appending the "fmode = 1" with the URL and we have modified the sigin_fmode.html to incorporate our customizations. IS there any other way shall we achieve this with out modifying the URL. Basically, with the same URL, we have to redirect to different sign on pages based on the device (mobile/desktop). It would be great, if you provide some advise on this. Thanks!

-Raja
ReplyDelete
Replies

Add comment