Correct content-type

I received a call that an ‘aged’ Domino application was causing problems in IE9. Stylesheets documents created by a form were not strict text/css but text/html instead.



Even though the On Web Access Content-type form properties were set correct.

After some digging & trying I ran into the following post that solved the case:

I normally use a simple document for stylesheets and JavaScript libraries in Notes. The form has a field for the “filename” (e.g. my_lib.js) and a field for the data. Until now I had been using a richtext field called HTML for the contents and changed the Content-Type on the form properties as appropriate (text/javascript, text/css etc.). This was working nicely until I created a page using the Strict XHTML DOC-TYPE.

It became an issue because Firefox requires that the Content-Type is text/css for stylesheets when rendering in Strict mode. Otherwise the stylesheet wont be used. Using the Live HTTP Headers extension for Firefox I saw that Domino kept setting the Content-Type to text/html even though the form properties was set to text/css.

Changing the richtext field name from HTML to Body solved the problem. Apparently Domino will not honor the specified Content-Type when the form has a field called HTML.

Indeed: One of those things in Domino…

Download: Twitter Bootstrap in Domino Blog

Have you sometimes the feeling that in case you know too much it may be used against you?

Recently I posted how to include Twitter Bootstrap in the IBM Domino Blog template.  Some time ago I blogged frequently about administrating that same Blog application.

From my Twitter Bootstrap post I received some questions from people for help so the easiest way to assist would be to make an example application available for downloading. The NSF contains all the documents that are needed to utilize (or get started with) Twitter Bootstrap within a Domino blog.

I also added some sample blog posts and link documents that refer to websites for education and resources (themes).


Here you can download the example:  link.


  • Extract the file.
  • Sign the application with proper ID.
  • Apply proper ACL settings.
  • Open the Configuration document and apply correct settings.
  • Launch the application in browser.
    • In case the HTML layout is rendered properly I suggest to save ALL documents under HTML Templates section.

Good luck!


A document list (~ Notes view)
Mobile display

Code templates in DDE: demonstration of CSS template.

In presentation AD103 ‘Embracing the EclipseTM Within’ Maureen Leland says (slide 14):

  • Code templates can be a tremendous time saver, and help implement common team conventions
  • Well received for LotusScript, but also available for:
    • Java
    • CSS
    • HTML
    • XML

If you take stylesheets for example, you can import them from the Database Navigator. But maybe you work on new projects where the stylesheets differ but you want to re-use a genuine setup of the file, setting up templates in Designer might help you.

I am not gonna write how you write a well structured css file and the benefits of it, but just explain how to setup a scratch for new css writing in Domino Designer.

First, open in Designer the Preferences and search after CSS. Select the ‘Templates’ links. Here you will see an overview of all your available CSS templates. Press ‘New…’.

Give your file a name, description and fill the pattern. Here for example I describe the basic layout for an HTML5 app. For the Context I select ‘New CSS’. Press OK to close the Preferences dialog.

Okey, so how you can get this in your next stylesheet?

If you haven’t already got it to your Designer setup, open the Package Explorer (Windows, Perspective, Open…). Go to the Resources folder, select Stylesheets and from there:


In the wizard enter CSS or navigate to the Web folder and select  CSS.

Give your new css file a name.

In the next dialog you are asked if you want to use a template. Select here the template you want and press Finish. The CSS Editor will open from where you can continue to write your CSS file.



Printer-friendly CSS for OneUI?

I have an application which is based heavy on the XPages Framework available on OpenNTF. When printing a document most of the images used for styling disappear. However I would like to provide an even more printer-friendly style-sheet. For example the left navigation, footer etcetera I do not found so very interesting to print.

But before I set up a custom CSS, has anyone done this before and is willing to share it?

View control messed up in Declan’s template

For those of you who would like to use Declan Sciolla-Lynch’s XPage framework as a default development template I have a warning when using View controls. It will lack the default presentation layer as you expect it would look like.

Here is how it shall look like:


I guess you rather would like that it will look something like this:


The reason for it is that the oneUI Theme does not extend the oneui theme. So in that theme add the following line:

<theme extends=”oneui”>

What you will notice then is that the application name will break the design:


Add an extra DIV to the bar section and clear any floating:


The ‘location’ bar is now back in line with the ‘application’ bar but a whitespace is noticeable.


In the custom.css you need to overwrite the default styling for h2:

.lotusForm h2 {
margin:0px 15px 0px 0px;

There you have it! You have the styling for a View control back.


Ps. I rather advice to take a look at examples provided by IBM (maybe the discussion template for 8.5 give help) or does somebody else have a good clean development template available?

XPages – Converting an existing Domino application

I would like t o quote a famous Dutch soccer trainer

Ben jij nou zo dom of ben ik nou zo slim?

Translated into English it would be something like:

Am you so dumb or am I now so smart?

I have read some tutorials about XPages and I have started with upgrading an existing Domino application with XPage technology. Basically I want to display documents with an XPage instead of a web enabled Form.

I have some nice center layered container layout with sections for a header, leftside menu, main and a footer. With a bit of help of  CSS it looks fine. Now I have started to transform the subforms into custom controls and the structure of the Form into an XPage. In stead of DIVs I am using Panels (I should or not?).

First thing I notice that panels in XPage technology only can get a name, when rendering this will be transformed into an ID. I have added my CSS for now in several files, later I will merge them together. For now for each custom control I have a CSS file attached to it.

What is happening is that the CSS get rendered well in Designer but when I look at the XPage in a browser the styling iscompletely gone! If I check in the source I see that all the ID’s have been modified, so I wonder if my CSS is still valid?

For example the original code:

<xp:panel id=”headerContainer”>

<xp:panel id=”headerLogo”>logo</xp:panel>

<xp:panel id=”headerName”>application name</xp:panel>

<xp:panel id=”headerSearch”>searchform</xp:panel>


get’s rendered as:

<div id=”view:_id1:_id2:headerContainer>
<div id=”view:_id1:_id2:headerLogo> logo</div>
<div id=”view:_id1:_id2:headerName> application name</div>
<div id=”view:_id1:_id2:headerSearch> searchform</div>

  • Uhm, can somebody explain how to correctly code my CSS? (it is being loaded).
  • Why have they done this? This makes converting current Domino applications into copy & paste & ready to run XPages enabled applications time consuming.
  • I guess the reasoning behind it is not logical for normal web developers so it makes the adaption of Domino harder for them.

Here how it looks:

In Designer (CSS is working):

In Firefox: