Skip Headers
Oracle® Fusion Middleware User Interface Customization Guide for Oracle WebCenter Interaction
10g Release 4 (

Part Number E14110-03
Go to Documentation Home
Go to Table of Contents
Go to Feedback page
Contact Us

Go to previous page
Go to next page
View PDF

16 Adding Custom Images

The Oracle WebCenter Interaction Image Service hosts all static web-based components, including style sheets, images, and JavaScript files. Removing these components from the main portal server reduces the amount of processing required to make pages available to the user. This chapter describes the Image Service and how to work with it.

To add custom images to the portal UI, always copy the image file to the specially designated location in the portal Image Service. This ensures that your custom images do not conflict with the many portal images.

Image Service Structure

The image below shows the standard directory structure of the Image Service.

Description of imageserver_structure.gif follows
Description of the illustration imageserver_structure.gif

More directories appear as products and services are added to the portal. Some areas can be customized and might be slightly different in an established implementation. There are two directories directly below the main \ptimages directory:

All Oracle WebCenter Interaction components are found under the \imageserver\plumtree folder; this configuration defines the namespace controlled by Oracle WebCenter Interaction. If you make any additions to the \imageserver directory, first create a subfolder with the associated company or product name.

The two main folders within the \plumtree directory are \common and \portal.

Within each of the \common and \portal directories, there is a \public and \private folder. This distinction allows developers to determine whether or not a component is static and backward-compatible.

Adding a Custom Image

As explained above, custom images should be stored in the following location in a standard portal installation: \ptimages\imageserver\plumtree\portal\custom\img.

If the image appears in a portlet or other gatewayed page, you can use the //images URI constant in the transformer Adaptive Tag library to access the URL to the Image Service. This is the recommended method. For details on using adaptive tags, see the Oracle WebCenter Interaction Web Service Development Guide.

If the image appears in a section of custom UI, you can also access the Image Service custom image folder using the code below.

// Get the base Image Service URL for a custom static content item
String strMyImageServerBaseURL = ImgSvrURLHelper.GetInstance().GetCustomURL(m_asOwner.GetIsSecuredSpace(), "portal");
// Add “img/” to that URL
strMyImageServerBaseURL = XPStringUtility.ForceEndsWith(strMyImageServerBaseURL, "/") + ImgSvrURLHelper.STR_L4_FILE_TYPE_IMG + "/";
// Create the completed URL to the image
String strImageURL = strMyImageServerBaseURL + "myImageName.gif";
// Assign the properties needed by this image to variables
String strImageAltTag = "Click here to see XYZ!";
String strImageHeight = "25";
String strImageWidth = "25";
// Create a new object of type HTMLImg
HTMLImg myImage = new HTMLImg(strImageURL, strImageAltTag, strImageHeight, strImageWidth); 

To make sure that you have generated a good image, you can print the HTML to be generated to Logging Spy using the following code:

// Print to PTSpy
String strTest = myImage.GetDisplayString();
PTDebug.Trace(Component.Portal_UI_Infrastructure, TraceType.Error, "***" + strTest + "***");  

After redeploying your code and looking at Logging Spy, you should be able to confirm that the link is valid. It should look something like the following:

<img src="http://localhost/imageserver/plumtree/portal/custom/img/myImageName.gif" alt="Click here to see XYZ!" height="25" width="25"></img>