Configuring Siebel Open UI – Change application loading image

Configuring Siebel Open UI‘ is our next series where we will discuss how to customize application as per business requirements.

Well,

Have gone through all Siebel Open UI training articles?

If not, we would suggest you to read Open UI tutorials first and then start configuration. 

Now its time to customize Siebel Open UI application.

We will start with few easy and interesting configuration requirements. Later we will discuss actual business scenarios.

Remember,

You must follow best practices as much as possible during Siebel Open UI configuration.

So,

Lets start with a simple requirement – change the application default loading image.

Though it does not have much business impact but we have seen many customers to change default loading images.

By default Siebel Open UI loading image looks like this – Siebel open ui default loading image(spinning wheel).

We will change it to this – Siebel open ui custom loading image(running man).

Though our custom image looks like static image but actually it is an animated image 🙂

Configuring Siebel Open UI -Change application default loading image

Sounds interesting?

Lets look configuration steps.

Steps for configuring Siebel Open UI loading image:

1. Verify custom image size

2. Rename out of box loading image (loadingAjax.gif)

3. Copy custom image

4. Verify Siebel Open UI application

Step 1: Verify custom image size

Very first step is to check custom image size. Image size must be less than or equal to 32 X 32 pixels. Otherwise Siebel will display only part of the image during application load.

To resize custom image, you can use any third party tool like Microsoft Office picture Manager, Picresize .

If you are using animated image, then don’t forget to save it with .gif format.

Step 2: Rename out of box loading image (loadingAjax.gif)

Do you know that loadingAjax.gif is responsible to display spinning wheel during application load?

So, before copying the custom image, rename ‘loadingAjax.gif’ file to keep the out of box image.

To rename the file, go to IMAGES folder under ..Client\PUBLIC\enu\IMAGES (for dedicated) or ..webserver\PUBLIC\enu\images (for web client), search for the file ‘loadingAjax.gif’ and rename it.

Step 3: Copy custom image

Now copy-paste your custom image file under IMAGES folder and rename it as loadingAjax.gif.

Step 4: Verify Siebel Open UI application

Delete browser’s cookies / history and launch the application. You should see your custom loading image instead of default image.

Simple and easy, isn’t it!!

If you have changed the default loading image in Siebel HI, then you are already familiar with these steps.

We have followed almost similar approach for Open UI also.

Do you want us to discuss any business scenario in this ‘Configuring Siebel Open UI’ series? please write us.

Also dont forget to leave your feedback in the comment section below.

Keep in touch, follow TechOneStop on Facebook / Twitter / LinkedIn / Google+.

                                                                                                                 Change icons on screen tabs >>

Watch our YouTube Video on how to configure Siebel Open UI to change application default loading image:


Siebel Open UI Quiz

Hope you have enjoyed our Siebel Open UI training series. Now it’s time to check your Open UI knowledge with our Siebel Open UI Quiz.

We have divided our quiz in three levels – Beginner, Intermediate and Expert.

Right now we have published beginner level quiz only. Soon we will publish other two levels also.

For ‘Beginner’ level Siebel Open UI quiz: Click here

If you have any question or want to share your feedback, please feel free to comment below.

Keep in touch, follow TechOneStop on Facebook / Twitter / LinkedIn / Goolge+.

How to remove ‘Case Required’ prompt from all fields, displayed on home page search applet

Fixing issues in Siebel Open UI is really fun. Well, let me explain you why so. Have you noticed such behavior in Siebel Open UI where ‘Case Required’ prompt is displayed for all fields on home page search applet? In SupportWeb, Oracle has reported this symptom as ‘There is inconsistent UI behavior between home page search applets and regular form/list applets when the field is reconfigured to support case insensitive searches’. Now see the below screenshot, you can see ‘‘ prompt for Opportunity name and Account name field but expected behavior is that there will not be any such prompt as those are not case sensitive search at all.

Case Required on home page in SIebel Open UI - techonestop.com

Oracle has taken this one as product bug (BUG #19001914) and stated like ‘This is a cosmetic issue as searching against the fields in the home page search applet will still be case insensitive, Until a fix for this is available there is no workaround’. But do not wait for their work around, we can fix it within few minutes. Follow below steps to fix it.

Step 1: Do ‘Inspect Element’
– Login into Siebel Open UI application and navigate to home page of any entity (Opportunity or Account or Contact) 
– Right click on any field from search applet and click on ‘Inspect Element’ option to launch inspector window

Inspect Element in Siebel Open UI - techonestop.com


Step 2: Locate CSS and file name

– Inspector window will keep the corresponding script highlighted under Elements tab. If it is not highlighted, then again right click on the field and choose ‘Inspect Element’ option.
From the script, you get to know that class ‘siebui-watermark-text‘ is responsible to display ‘‘ tag in watermark.
– From right hand side window, locate the CSS class ‘siebui-watermark-text‘ and change the color from ‘#C0C0C0’ to ‘#FFFFFF’. Can you see ‘Case Required’ tag now? You have just changed the color to White (:D)
– For us, CSS file name is ‘theme-gray.css’. This CSS file could be different based upon the theme that you are using
– Now refresh your application, it will display ‘Case required’ again
CSS in Siebel Open UI - techonestop.com


Step 3: Change theme-gray.css file

– Open the file ‘theme-gray.css’, located under ..Client_1PUBLICenuFILES (for dedicated client) or ..SWEAppPUBLICenufiles (for web client)
– Find the string ‘siebui-watermark-text’ and change the color code from ‘#C0C0C0’ to ‘#FFFFFF’.
  It should look like below:
                     .siebui-watermark-text{
                           color: #FFFFFF !important;

                     }

– Save and close the file

Step 4: Verify changes
– Restart web server service (For Windows environment, web server service name is IIS Admin Service)
– Clear browser cache and launch Siebel Open UI application
‘<Case Required>‘ is gone from search applet!! Same way, you can change field text color, font, background color and many more. To get more details, read our article on Siebel Open UI theme.
If you face any problem, please let us know. For more updates on recent activities, follow ‘TechOneStop‘ on Facebook / Twitter / LinkedIn or join our website as follower.

To know more, watch our YouTube video: