Posted under JSF
Permalink
Tags Bug, CSS, Gotcha, JSF, Primefaces, Tip
I tried to use this whilst experimenting with dyamic style sheets, but this support post here confirms that it does not work due to an issue with the way the images are referenced.
The symptom is that you get basically correct looking layout/colours but none of the images have loaded.
The solution is to use a link tag directly e.g.:-
<link type=”text/css” rel=”stylesheet”
href=”#{request.contextPath}/resources/themes/#{themeSelectorBean.theme}/skin.css” />
Whilst on the subject of h:outputStylesheet, it should be noted that for the following example:-
<h:outputStylesheet library=”css” name=”styles.css”/>
Whilst the href of the resulting generated link tag looks like this:-
<link href=”/context-root/faces/javax.faces.resource/styles.css?ln=css”
rel=”stylesheet” type=”text/css”/>
the actual physical directory containing the style sheet in this case will be
…\WebContent\resources\css\style.css
i.e. the logical to physical mapping of the web path in this case is not straightforward and obvious. If you just create the resources folder under your project’s WebContent folder and place all your libraries as subfolders under that, it should all work correctly (the above issue with jQuery/Primefaces notwithstanding)!
Leave a Reply
You must be logged in to post a comment.