More on IBM Connections 5.0 UI Customization

Connections

I’ve been receiving quite a bit of traffic for my recent post titled IBM Connections 5.0 UI Customization.  So, I thought I would do a follow-up post with some additional information.

The first thing you should know is that using images with CSS is broken in the IBM Connections 5.0 eGA code.  In order to get this functionality to work, you will need to install a few fixes.  These fixes should be included in the latest CR fix-pack.

The IBM Connections wiki has recently been updated with instructions for replacing the default logo.  These official instructions suggest two ways for using CSS images in your customizations.  However, there is a third undocumented way that this can be accomplished.  This undocumented option is the one that most closely resembles how customizations were performed in previous releases.  That is, you put your images into the themes directory and use relative paths in your CSS.

Here are the three ways you can use CSS images in IBM Connections 5.0.  Choose whichever option you like best.  They should all work.

Location of CSS

Put the custom.css file in location:  <customization_dir>/themes/gen4Theme

Option 1 (This option no longer works!)

Put images in:  <customization_dir>/javascript/com/ibm/lconn/core/styles/images
Use the following CSS image URL:  url(“/com.ibm.lconn.core.styles/images/logo.png”);

Option 2

Put images in:  <customization_dir>/javascript/com/ibm/oneui3/styles/images
Use the following CSS image URL:  url(“/com.ibm.oneui3.styles/images/logo.png”);

Option 3

Put images in:  <customization_dir>/themes/gen4Theme/images
Use the following CSS image URL:  url(“/com.ibm.lconn.core.styles.oneui3/gen4Theme/images/logo.png”);

 

You may also like...

4 Responses

  1. None of this solutions is working for me. It doesn’t matter which option I try I get blank icon which is not found on server under this address: http://oi60.tinypic.com/1zv99pt.jpg

  2. With Connections 5 CR1 only Option 3 is working. On the other options or using /images/logo.png (for images on the webserver) the trailing slash is removed, when i check in firebug.

  3. Christian says:

    With Connections CR3 None of this solutions is working for me

  4. Christian says:

    I rectify, option two work for me

Leave a Reply