Changing the Favicon in PeopleSoft – The “How to”

Last week I posted a blog entry highlighting why I think adding a favicon to PeopleSoft can be a helpful visual aid for your users.  This post walks through how I did it – note: I’ve only tested this in Tools 8.50.

Step 1 – Create your icons

It’s probably a good idea to have one for each environment excluding Production that shows the environment name, and then have Production as the corporate logo (or your PeopleSoft system logo etc).  I created my 32×32 pixel images in GIMP as it can save as a .ico file, but any graphics package will do (as will this online ico creator).  I didn’t experiment with other sizes or file formats, let me know if you do and I’ll update the post.

Upload your icons as images in App Designer.

Step 2 – Create a Function to return your Favicon

We need to create a function to provide the correct image for each environment as we’ll be calling this from more than one place.  I added my function to WEBLIB_PT_NAV.ISCRIPT1 as we’ll be customising it later anyway.

01 Function GetFavicon() Returns string
02
03    Local string &Favicon;
04    Evaluate %DbName
05    When = "DEV"
06       &Favicon = %Response.GetImageURL(Image.<>);
07       Break;
08    When = "TST"
09       &Favicon = %Response.GetImageURL(Image.<>);
10       Break;
11    ...etc...
12    End-Evaluate;
13
14    &Favicon = "";
15    Return &Favicon;
16 End-Function;

Step 3 – Amend the HTML Definitions

You need to amend both PT_HNAV_TEMPLATE and PT_IFRAME_HDR_SWAN HTML templates so that the code for the Favicon can be passed in.

Amend PT_HNAV_TEMPLATE thus (I’m just showing the top 6 lines – lines 4 and 5 are the ones I’ve added):

1
2
3
4
5 %bind(:23)
6
7 ...

Amend PT_IFRAME_HDR_SWAN thus (I’m just showing the top 5 lines – lines 3 and 4 are the ones I’ve added):

1
2
3
4 %bind(:25)
5
6 ...

Note: Your bind numbers may vary. You can check they’re correct when we get to the calling functions shortly.

Step 4 – Pass the Favicon into the HTML templates

The final step is to amend the PeopleCode so that the string provided by our GetFavicon function is passed into our HTML definitions.  Open PT_BRANDING.BrandingBase.  Scroll down to where the delivered code is declaring functions (it’s around line 155 for me) and declare the function that you created in Step 2.

Next, find method ‘getIframeHeaderHTML’ and scroll down to near the bottom.  You’ll see a call to one of the HTML objects that you just amended ‘PT_IFRAME_HDR_SWAN’.  Add your function as a parameter to the end thus:

1 &hdrHTML = GetHTMLText(HTML.PT_IFRAME_HDR_SWAN, &charSet, ... , &hoverNavLoc, GetFavicon());

As a double-check, you should also make sure that it’s the same number parameter as the bind variable that you added in the previous step.

You’ll need to make a similar change for the other HTML template.  Open WEBLIB_PT_NAV.ISCRIPT1.FieldFormula and search for the function ‘buildIframeTemplate’.  Again, scroll down to the end of the function and add your function as a parameter to the end:

1 Return GetHTMLText(@("HTML." | &templateHTMLObjName), &charSet, &requiredToolsSS, ... , &ptcxmCollapseImgURL, GetFavicon());

Again, make sure that the parameter number matches the bind number in the HTML file (PT_HNAV_TEMPLATE) earlier.

Testing

You should be able to sign in and see the results immediately.  Good luck and let me know how you get on!

Like this:

Like

Be the first to like this post.

Comments»

1. Andrew Williams - May 19, 2011

You can also put the favicon.ico in your webserver root directory (where your browser automatically looks). If it’s weblogic you’ll need to restart the webserver for it
to be picked up. This works in 8.48+

Reply

Tipster - May 19, 2011

Provided you can remember to put it there after every redeploy of the PIA that’s certainly a quicker and less intrusive way. Presumably it’s a single Favicon across all sites/environments underneath that web server?

Reply

2. Andrew - May 23, 2011

You’re right you need to remember to do it, the hardest part. And it’s only per site. We seperate our sites for dev and test etc, so it will depend on your architecture.

Reply

3. Dave Howard - June 24, 2011

We have taken a different approach, with the intent to achieve the same thing.
Instead if coding an iScript, changing HTML, etc., we simply replace the NEW_PS_LOGO image.
We create a .JPG file that designates the name of the database and save that in Application designer as NEW_PS_LOGO image. We have also built a project with that image and exported it to a file. Whenever we refresh one of our databases, we import the project and the image will now show the name of the database….no coding and the testers love it.

Reply

Tipster - June 25, 2011

We do this too (although we have some code that changes it based on %DBName so there’s no post-refresh activity), but if you have four minimised windows you can’t see which is which until you’ve cycled through them all.

Reply

4. John Desmet - July 6, 2011

Dear all,

Today I ran the steps in PeopleTools 8.51.02 with success. Unfortunately the AppDesigner cannot display the ico image.

Thanks,
John Desmet – Belgium

Reply