Editing the Help_Contextual icon in RichWidgets?

Editing the Help_Contextual icon in RichWidgets?

I want to edit the icon that RichWidgets uses for Help_Contextual. What's the best way for me to do this so that I do not need to repeat the work whenever RichWidgets gets upgraded? I like the current icon, but I want to give it a transparent background because I use it in a few places where there is color behind it.



Hello Justin,

If you change something you always keep attention when publishing/installing a new RichWiddgets.

2 ways I know:

1) Copy the CSS style of the Help_Contextual from the RichWidgets to you're own espace. If you change the CSS 'opacity' element to a lower value the image get more transparent. This CSS style will be set over the RichWidgets CSS Style. So publishing a newer version of the RichWidgets only give problems when the name of the container is changed in the RichWidgets (where I think this wouldn't happen quickly), but you'll do need to watch it.

2) You can change the Help Image in the RichWidgets with a more transparent one, but if you publish a newer version you should merge with the older version and keep your own Help Image.

Kind Regards,


Let me share my case with you...

I've just undone a richwidget customization that turned out to be a major disaster when upgrading to 5.1 (from 4.2)

My solution to future upgrades is to encapsulate the richwidget component in our own webblock library and then override the CSS styles within that webblock (version 5.1 not only has a javascript for the web block but also a CSS script).

In some cases you can actually mimick the weblock behaviour even if you have to copy javascript from one richwidgets to your own library.

If you want further customization you can still override the CSS style again in the client OML.

But no more include directives in CSS and future upgrades should be no problem.


This customization is *not* at the CSS level. I need to fix the image file itself. The problem is that the image file needs to have transparency as a background and not white; making the image transparent won't help. But, you guys have given me an idea. I could just set a JavaScript at the eSpace level (or in my header Web block) to look through the document and set the image file to what I want it to be when I see references to it.

It's fairly annoying that I have to use hacks to swap the image file, though. I agree that the last thing I want to do it edit RichWidgets directly, or deal with a merging scenario, that's just a maintenance nightmare.

Hi Justin,

In the next RichWidgets release that image should already have a transparent background.

Tiago Simões 
Tiago -

Awesome, thanks! I had made a mental note to submit a "Wisdom of the Crowds" on this. :)

Any idea of about how long it will be until that release (a few weeks, a few months)? I would much rather just have it built in to RichWidgets than hack my copy of RW up or bother with JavaScript.

Thanks again!

Hi Justin,

That should be available in a few weeks. It is included in EnterpriseManager so just keep an eye on it.

Tiago Simões

Since the image has a transparent background isn't shown as a perfect circle in IE8 and lower. It's an octagon.