Adding <link> in header

We have the requirement to add a link into the element of Vaadin application. This link element looks following

The custom.css has some styles that needs to be applied on the component of the elements which are Vaadin ui components.

I want to ensure that the in header is added and possibily browser always would have loaded the custom.css before the rendering of the body UI elements start so that the custom.css can be correctly applied on UI element.

What is the correct way to ensure this scenario? What time should I call my custom inject API to inject the link in header which can guarantee that it will be added before body rendering? OR is there any client side thing that I can do?

Any suggestion from Vaadin experts will be appreciated.


For Vaadin 6, you should use your own servlet that extends AbstractApplicationServlet (or ApplicationServlet) and override writeAjaxPageHtmlHeader to write out the tag and then call super.writeAjaxPageHtmlHeader so the stuff Vaadin needs is also included in the HTML.

For Vaadin 7, please see
this tutorial

Thanks Leif. But I am on Vaadin 7 alpha 1, will this work on alpha 1?

Neither works in prerelease versions of Vaadin 7 prior to beta1 (or maybe alpha3, can’t remember when the new functionality was added).

To get it to work with Vaadin 7 alpha1, you’d need to replace the BootstrapManager, which probably can’t be done without subclassing CommunicationManager which in turn requires digging into AbstractApplicationServlet. And even in that case, you might have to use inheritance by copy-paste as the BootstrapManager sub class used by CommunicationManager is probably not extendable.

It might then be easier to instead hack around the problem by e.g. adding a servlet filter that on the fly rewrites the output to add that one line of HTML at the right location.