Have you tried using the Pagelet Wizard's HTML data source to add Google Gadgets to your PeopleSoft Homepage? If not, browse through the Google Gadgets directory and select one you like. After customizing your Gadget, click the "Get the Code" button. Notice the code is an HTML script tag. Copy this code and paste it into the HTML editor of a new Pagelet Wizard HTML data source pagelet. Publish, save and add your new pagelet to your homepage. Did you notice anything unusual... like... the Gadget appeared at the top of the homepage, not within the pagelet's designated area? If you look at the source code for your homepage from within your browser, you will notice that the script tag you copied is actually in the homepage's head element, not in the body. This behavior is the result of the way the PeopleTools portal constructs the homepage. For each pagelet on the homepage, the portal retrieves the pagelet's source and reviews it prior to inserting it into the homepage. If the pagelet's source contains a full HTML document (with HTML element, head, and body), then the portal will insert the components of the head tag into the homepage's head tag. For example, if the pagelet's head tag contains style definitions, those style definitions will be inserted into the head tag of the home page. Likewise, if the pagelet's source is not a full HTML document, but contains script, link, or style elements at the root, or top level, then those elements will be inserted into the head tag of the homepage. This behavior is by design. It allows pagelet designers to embed script and style definitions into the head element of pagelet HTML documents, the only valid place for sytle definitions.
To work around the homepage construction issue, wrap the HTML provided by Google inside a <div> tag. This will keep the portal from moving the script element. I use the following HTML to center the gadget within the Pagelet's defined box. Adjust the width to match the width of your Google Gadget plus a pixel or two.
<div style="margin-left: auto; margin-right: auto; width: 325px;">Google script...<div>
Here are some Google Gadgets you will find on my PeopleSoft homepage Google Calendar, Google Talk, and Google News.
25 comments:
Hey Thanx, Jim,
interesting post...I had to create a new Tab to get all my gadgets in PeopleSoft...
@ciphersbak, cool! There are tons of gadgets out there. Which ones are you using? Any that help you with your business?
Hi Jim,
I'm presently using the ones that you had listed...along with that i have a few for the Indian Stock Exchange...and the one that i like the most is the Google Translator...for translating into HINDI...I also have the Google Docs...
Jim had a question...here...presently what i have been doing is that for all the diff. gadgets that i have on the PS Site have been created using a new Pagelet everytime...along with the snippet code that u had pasted in your blog...is it possible that i create a single Pagelet and paste the scripts for all of them in one...for the time being i have used the export Pagelet wizard to carry forward the customizations...
Hi Jim,
I just added the Free SMS Gadget (in India) on to my PIA...
really kewl!
Thanx a lot!!
looking fwd to more exciting stuff...
Cheers!
Prashant
@ciphersback, migrating the Google Gadget pagelet HTML into another pagelet... good question. Here are a couple of options: Create a Google Gadget Data Source that has parameters for width, height, and script. Another option is to create a custom transform for Google Gadgets that wraps the Google provided JavaScript with the div HTML. Here is my favorite reference for creating a custom pagelet transformer: Markdown Text Filtering for PeopleSoft. I think it would be a good idea to create a Google Gadget data source for the Pagelet Wizard. I'll take a crack at it and post it as a blog entry if I get it working.
As far as putting all your gadgets in one pagelet, yes, definitely, just put each one in a different div within the same HTML pagelet. If you do this, then you will want them all to be the same width. If you do this, all your Google Gadgets will display in the same column. If that is what you want, then, yes, feel free to put them all in one pagelet.
Hi Jim,
Instead of migrating the pagelets, i was planning to use the system as a WSRP provider...and consume the ones that i want to display on another PIA...the pagelets have been successfully exposed...Is there a way that i can get/create a gadget which contains a list of all the cases that i have opened with Oracle GCS...
Thanx!!!
@ciphersbak, a GSC open cases WSRP provider would be very cool. GSC should publish the open cases pagelet. I know you have a mix.oracle.com account. You should post this as an idea on Mix in the PeopleSoft and PeopleTools groups.
Hey
Thanks for info... very nice...:)
Raj
amazingly good and easy. Thanks so much.
Jim, I am using Portal rel 9, and trying the gadget pagelet, and not having any success. If I put the HTML code into a text file it works fine, within the PeopleSoft Portal it does not get transformed correctly, and simply see the URL. Any ideas what I might be doing wrong. I tried the Calendar and also one of the News gadgets
I tested this in the PeopleSoft 8.9 of financials and it worked fine for the CNN news gadget. Looks like there is a difference in 9 on how the HTML is being wrapped from the pagelet. Still need to look further on how to correct this, any ideas would be welcome
Just wanted to post an update, that I found the fix. I had to click an extra button in Portal 9 in order to switch to HTML text source mode, before pasting the text.
@Surinder, you are correct. You have to click the view source button.
Be careful using Google Gadgets. I figured out how to embed them, but I cannot vouch for their security. By inserting Google Gadgets, you are injecting someone else's JavaScript and allowing it to interact with your PeopleSoft page. For the most part this seems harmless. Nevertheless, since the Google Gadget JavaScript runs in the context of the page, it is possible for a malicious script to employ session hijacking techniques to steal a session. If your PeopleSoft instances are behind a firewall, then I doubt someone from outside your organization would be able to gain access to your PeopleSoft instance to hijack a session. It is important that you are aware of the security risks presented by this solution.
When I try this in our development PS Portal (9.1) I get errors that it can't load due to certficate errors. The hosted gadget code is on a non-ssl server and so even though the calendar is SSL, the gadget won't load. Has anyone run into this?
Hi Jim,
Its an interesting post. Am new to peoplesoft,am following your blogs to achieve my next level in Peoplesoft milestone. I have a query regarding this gadgets. I am trying to configure google search in our HCM PIA. While creating a Pagelet, I have selected URL as data source and have given the http://hosting.gmodules.com url to access google search. But unfortunately am unable to proceed further. Please advise me on the same to get it done.
@Priyanka, in regards to Google Gadgets, I have had trouble lately with both PeopleSoft's Ajax loaded pages (no document.write) and Google's JavaScript. I had to give up. It used to work, but I haven't worked on it for a long time.
Hi Jim,
I am new to peoplesoft , i am trying to create and Pagelet for google translate, i created a new pagelet and selected data type as HTMl and copied the GET CODE of google translate into the Data source in Pagelet, when i preview it i am able to see the html code in the preview, not the dropdown of google translate. kindly can you please help me how to solve this issue.
@Harun, later versions of PeopleTools use a WYSIWYG HTML editor and they locked down the view source button making it impossible to paste HTML source into the HTML editor. You have two work arounds:
1. Enable the source button in the HTML Editor
2. Use the Free Text data source available with PeopleTools 8.53. If you have 8.53, this is the best option.
Hi Jim,
@ JIM , Thanks for your response, we are using Peopletools 8.52 and PIA 9.1.
I have done tried the below method and i am able to have smooth transition from sigon page to all delivered and custom pages, The google translate is working. SO just thought of sharing the same.
/*****In Pagelet i define the below Header, adding the HTML code for Google Translate******/
Define Headers
In Define header we can add HTML code of google translate, i am unable to update the HTML code in the blog,If any body requires the code you can drop a mail to me harunkumarmba@gmail.com
Pagelet Wizard
Create a Wizard by tagging this Header to it. Additionally, enable Homepage Pagelet to HRMS Portal Pack
This displays Google Translate in all the transactions. To remove Google Translate TOOLBAR from the pages, login to AD and navigate to Default Style Sheet PSSTYLEDEF_SWAN. It is not possible to update PSHDR2_SWAN under FreeFrom SubStyle Sheets. To enable updating this page, goto GO > Definition Security and exclude PSSTYLEDEF_SWAN.
Now append this code to the existing PSHDR2_SWAN code.
.goog-te-banner-frame.skiptranslate {
display: none !important;
}
body {
top: 0px !important;
}
Appending this code removes google translate completely from the homepage.
TO Add code in signon Page, we have to change the code of HTML in server, MY DBA did the changes so will share later , but he used the above html code. But if we use the above code the password also converts to HINDI so it will not allow user to login, I will share what changes has to be done to ignore converting uswerid and password.
Now, choose language from sign on page - this is impacted across all pagelets and menus.
However for individual pages please create a HTML definition using the above HTML, and create a DERIVED field. Now the pages you want to have google translate, Insert HTML area and on record peoplecode call the HTML function.
So once you have added on Sign on page, Pagelet and on custom or delivered pages, when you select the language type as HINDI for eg, then then My page and all pages are automatically converted into HINDI language without any problem.
Regards,
Harun Kumar
harunkumarmba@gmail.com
+91 8976795365
Hi Jim,
I have selected the dta source as HTML. On entering html code in HTML Text editor of Pagelet, im getting the code as such in the pagelet with all html tags.It is not getting converted.Please advice.
@Krithika, I'm sorry. This no longer works. The HTML data type no longer lets you enter HTML (without a server side modification) and the Google Gadgets API is different.
Hello Jim,
First, I've been following your blog since a long time ago and I think is one of the best out there. So thanks for sharing your expertise.
I wonder if you are aware of any strategy regarding implementing Google's API with PeopleSoft. I'm thinking specifically on Google Translate API and Google Search.
Oracle does not support all existing languages, most of them yes, but some not. It would be great to be able to use Google's APIs for it.
Also, since PeopleTools 8.55, Oracle SES is mandatory in order to have search functionality, wouldn't it be easier just to implement google search within the webserver?
Since the implementation of Deep Learning algorithms in google's API, the services have increased their quality dramatically, I believe this would be a real advantage for PeopleSoft customers.
@Rog, SES is now deprecated in favor of elastic search. I believe the PeopleSoft metadata remains the same, but the underlying search engine changes. Yes, absolutely, it would be possible to use a Google Search appliance instead of SES or Elastic. I considered doing this several years ago. The effort will be in wiring that into the PeopleSoft user interface since Fluid uses key word search in place of regular component search pages.
Hi Jim,
Am trying for a proof of concept in PeopleTools 8.53/ FSCM 9.2. To integrate google translate cloud API. Like on page, on click of button we call translate API and display as response on Text area. Can you highlight some of your thought and directions?
@Amitanshu, this is great! This should be relatively simple by using a JSON API from IB or possibly even through CORS/Ajax
Post a Comment