Saturday, May 22, 2010

Enable View Source in Online HTML Editor

If you use the Pagelet Wizard or Enterprise Portal's Managed Content features, then you have likely seen the PeopleTools online rich text editor. With PeopleTools 8.50, PeopleSoft switched to the CKEditor and added rich text editor configuration options to App Designer. This allows you to turn any long text field into a rich text field (although I don't recommend doing so, as it can have a negative impact on reporting).

The former rich text editor had a view source button. For security reasons, the PeopleTools team removed the view source button from this release. If you trust the users that have access to rich text editor pages (like the pagelet wizard) and would like to re-enable the view source button, then add 'Source','-', to the config.toolbar array in your rich text editor configuration. Here is a fragment of the configuration file:

        config.toolbar =
[
['Source','-','Maximize','

Where do you find your rich text editor's configuration? The PeopleBooks appendix Creating Custom Plug-in Files for the Rich Text Editor describes how to configure rich text editors on a per-page, per-editor basis. To change the default configuration, open the ckeditor/config.js file in your webserver's domain directory. For example, if your web server domain is named portal, open $PS_HOME/webserv/portal/applications/peoplesoft/PORTAL.war/portal/ckeditor/config.js.

35 comments:

Jarod Merle said...

Is the primary reporting ramification that you would have to remove all the HTML tags from the field for it to be useful in anything but an HTML-based report? I've began implementing it on a few pages (mostly for defining email notifications), so I'm curious to hear if there is anything else I'm not thinking about. I've definitely noticed that it can be a bit buggy, especially if the content is fairly large, which makes me hesitate to use it for other reasons.

Jim Marion said...

@jarodmerle, yes, the problem is with reporting. If your report is designed to think the content is plain text, but you have HTML tags in there, then the obvious output would be unparsed HTML.

For the "buggy" behavior, which browser are you using? My favorite PeopleSoft browser is Chrome. It isn't supported, but it is lightning fast. Firefox is my second favorite. I won't even mention the other supported browser. It is so slow... I only open it when I'm forced to use it.

Jarod Merle said...

Thanks for clarifying Jim.

Unfortunately since my business customers are on IE, I have to use IE since things don't always render the same on other browsers. I would much rather use Firefox (or Chrome, although I'm not as big of fan of it), but then again I'd much rather be running Ubuntu on my desktop and I don't get that luxury either :).

I've seen problems on both IE7 and IE8. Things like the cursor not being placed where you click, the editor window not responding to clicks, even weird memory errors when the page is saved. I also quickly discovered that it does a thorough job of stripping Word-specific tags from text pasted in, so outputing the data back to Word for printing purposes isn't possible. Not so much a bug, but it was annoying to have to continue using the old-school HTMLArea editor we had implemented for a custom system (which had it's own set of issues caused by the tools 8.50, and only works in IE which is another reason I have to use it).

Jim Marion said...

@jarodmerle, do you have problems with the CKEditor on IE? My users use IE 7 and have not mentioned any issues.

Jarod Merle said...

@Jim Marion

Yes, I've definitely seen problems on IE7 and IE8, primary when data has been copied in from Word (which I assume would be fairly common). Just now in fact I tried copying in a document (a form letter with moderate formatting) from Word to a custom secondary page with the Rich Text editor enabled, and when I clicked OK, IE8 froze up, eventually gave me a warning about a script on the page causing errors, and then froze again and eventually died.

I've seen strange behavior even on delivered pages though. For example, when defining a query feed element with the rich text editor, it will add extra line breaks each time you return to edit the element.

I'm hoping some of these things will improve on later minor releases (we are on 8.50.04 now), but I even tried manually updating CKEditor to the latest version available and it didn't seem to make much difference.

Jim Marion said...

@jarodmerle, that is true. I have seen it re-interpret the HTML. For example, if you put in a div tag in the source editor and then a span outside the div, then the editor will wrap the span in a "p". I've found that it tries to create good, clean HTML. In my case, for example, my HTML was wrong. Once I fixed it, it worked just fine. Just for fun, you should try running your HTML through Tidy first, just to see what happens. You can find an online version at http://infohound.net/tidy/

Jarod Merle said...

I'll give Tidy a try just for fun. I definitely hear what you're saying about the Rich Text editor fixing problems in the HTML. Unfortunately though, all an end user sees is that what they copied in from Word is getting "changed" or "messed up" in PeopleSoft.

I've basically started instructing our analysts and users to not try copying in anything that has a lot of formatting, and to ideally just enter the content directly into the editor.

The Rich Text editor is a really nice feature, but it just doesn't work well the way a typical end user (at least here) would be using it.

James said...

An unrelated question about Tab Content options for Pagelet behavior. When I select Opt-Dflt (option-default), the Pagelet is NOT checked automatically so that the user can see it on their Homepage. The user will have to personalize their Homepage to enable it, so that they can see it. NOTE: I am using PTools 8.49. Have you experienced this behavior, and any idea how to fix it?

Jim Marion said...

@James, With optional/default, what does it do for new users? I think new users will see it added, but if a user has customized their homepage, then it might not show up.

James said...

@Jim New users will see the Pagelet by default on their homepage. I was under the impression that existing users would experience the same behavior. Existing users must enable the Pagelet via the Personalize button for their homepage in order to see it. I thought the behavior might be the same for new and existing users.

Jim Marion said...

@James, right. Once a user configures his/her homepage, PeopleTools does not change it (unless you choose required).

j harvey said...

I'm more of a functional user, so this may sound thick.

I would like to enable View Source on our PS Portal (P Tools 8.51), but do not have the access to make these changes. I've requested that our server administrators implement this, which they say they've done, but nothing has changed.

I know this isn't a lot to go on, but was hoping someone could help me out. Is there some obvious step they may be missing? I need to explain how to do this, without being able to see just how they've set up our servers.

thanks,

jeh

Jim Marion said...

@j harvey, After changing the values, make sure they restart the web server. That is about all you can do.

PS Swami said...

I have been using the rich text editor and actually changed the message catalog to allow the rich text. This works great and the users love it. However.... they now want to use images. I can use the upload image function in the editor. PS loads it to
src="/ps/dev/cache/PTRTDB_GIF_blahblah0.GIF"
This works great in dev. When you do the view source you see the hardoded PS env. Is there anyway to manage this through migrations or do you have to run a sql script to handle this?

Jim Marion said...

@PS Swami, good question. I have worked with it a bit, but not enough to know how to handle migration. I suggest you open an Oracle support ticket for that one.

Pat said...

@PS Swami Probably not much help to you but if you store the image in the database as an image object you can reference it via %Image(PS_EXPAND_ICN) in the image source. But again that means the image is in the database.

Pat said...

@PS Swami Sorry for the multiple posts.
When you configure your page field for the rich text editor enable the delivered Image Location URL Id "PT_RTE_IMG_DB_LOC" which after you look in the URL table is pointing to a record called PS_PTRTDB. So when you configure the page field to use this value the images are stored in the DB.

The reference to the image in the source of the rich text field only points to a cache location version (/cs/ps/cache/PTRTDB_GIF_.....) without any specific instance info so easily migrated.

You could then use a DMS to move the image record PS_PTRTDB info around at the time of migration.

PS Swami said...

This is a good idea;however, we change the name of our cache directory too often for this to be a workable solution.

Pat said...

@PS Swami
Could you please explain how and why you change the cache directory name?

Jim Marion said...

@Mansoor, unfortunately, I have no idea why your rich text editor is behaving that way. I suggest you file a high priority case.

Perhaps one thing you could do while you wait for a solution is to turn off the rich text editor? If you open the page in App Designer, find the rich text data control and open its Page Field Properties. In the Options Tab, uncheck the Enable Rich Text checkbox. Test it in your development environment first, of course.

Mohit said...

Hi Jim,

We upgraded the PeopleTools 8.48 to 8.49 and after that CKEDITOR is not working with IE.

Could you please help me on this or let me know the other HTML Editor which I can use?

Regards,
Mohit

Jim Marion said...

@Mohit, you should open a case with Global Support for this issue.

Mohit said...

Hi Jim,
In HTML Editor Area PeopleTools 8.49, text is not getting saved in the record, if I remove HTML Editor it's getting saved. Can you please provide any suggestions?

Regards,
Mohit

Jim Marion said...

@Mohit, you might try posting your question on the PeopleSoft General Discussion space of the OTN Forum.

Unknown said...

Hi JIm,
We turned on Rich text editor on one field. I want to limit this feature only for some values. So the question is, How do i disable rich text editor feature for some values using peoplecode?
Thanks
Amar

Jim Marion said...

@Amar, the Rich Text (ckeditor) uses JavaScript configuration files. I am not sure you can limit based on values, but only based on components... I suppose one method would be to add an HTML Area to your page, bind it to a derived work record, and include JavaScript to redefine the ckeditor's initialization parameters. PeopleBooks includes information on configuring the rich text editor.

Sharad Patel said...

Hello Jim,

this is gr8 blog to read about CK editor in PS, we are trying to improve the spell check feature for some of the rich text box

few questions that going through my mind :

1. Is it possible to create custom Java script or plugin to enable SpellCheckAsYouType on peoplesoft page.(Same as i type in this comment box)

2. Is it possible to create some button which will take peoplesoft field data to word doc and when user close the word doc after editing , bring the whole stuff back to PS page :)

3. Is it possible to have single spell check button for all page fields [Multiple page fields] instead of having spell check button against each fields

we are on PT8.52.09

Regards
Sharad

Jim Marion said...

@Sharad, everything you asked is possible. Some of the may be a lot of work.

Sharad Patel said...

Thanks for Reply

I am more intrested to implement spell check as you type.

Will is possible for you to guide me ??

Unknown said...

Hi,
When I upload an image. I am not able to send it to the srever. The image in the rich text editor is not geeting uploaded can please advice. I want to attach image in the rich text editor.

Jim Marion said...

@Saranya, For this issue, I suggest you log a support ticket with MyOracle Support.

Unknown said...

@Pat O'Hare
I'm using %Image([IMAGE_NAME]) in pagelet wizard. It works in preview, but not on the homepage. Any ideas?

Thanks.

Jim Marion said...

What PeopleTools release? %Image is not supported in Pagelet Wizard until 8.54.

Unknown said...

After every 'enter' the editor adds a 'P' to the html-string.
I want to a 'BR' instead of a 'P'
Where and how can i do that?
Do I need to make my own version of de default.js file? Or is that done somewhere else?

Jim Marion said...

@Roel, great question about changing the enter key behavior to insert br elements instead of paragraph elements. I am afraid I don't know the answer. You may want to ask this question on the PeopleSoft General OTN forum.