user550738
user550738

Reputation:

how to set a PrimeFaces theme?

I'm trying to get my PrimeFaces (v2.1) app to use a different theme.

I downloaded vader-1.0.0.jar and put it in my WEB-INF/lib folder.

I added the following to my web.xml:

<context-param>   
  <param-name>primefaces.THEME</param-name>
  <param-value>vader</param-value> 
</context-param>

But when I run the app, the theme does not change.

Is there something else I'm missing?

Upvotes: 9

Views: 62877

Answers (4)

Lucas Do Amaral
Lucas Do Amaral

Reputation: 137

You can define the theme dynamically like that:

web.xml:

<context-param>
    <param-name>primefaces.THEME</param-name>
    <param-value>#{themeBeam.applicationTheme}</param-value>
</context-param>

the Bean:

@ApplicationScoped
@ManagedBean
public class ThemeBean {

    public String getApplicationTheme() {
        return "dark-hive";
    }

}

Upvotes: 7

Zofren
Zofren

Reputation: 1190

Theme packaged in a jar is supported since Primefaces 2.2 final.

"primefaces.THEME" replaces "primefaces.SKIN" in web.xml.

Upvotes: 3

Renan
Renan

Reputation: 741

Using PrimeFaces 2.1 I just put

<link type="text/css" rel="stylesheet" href="#{request.contextPath}/themes/cupertino/skin.css"/>

inside <h:head> of the page (in my case, a template). Nothing else.. And it worked!

Upvotes: 7

Matt Ball
Matt Ball

Reputation: 360016

At least in PrimeFaces 2.2, the correct parameter in web.xml is primefaces.SKIN:

<context-param>
    <param-name>primefaces.SKIN</param-name>
    <param-value>none</param-value>
</context-param>

Edit from @Cagatay's comment: "primefaces.THEME is the official parameter name, others are deprecated and will be removed in 3.0."

This allows me to dynamically specify a skin using a session-scoped bean:

@Named @SessionScoped
public class LayoutBean
{
    ...
    private String theme = "aristo";
    ...
    public String getTheme()
    {
        return theme;
    }
    ...
}

Then in the markup:

<link rel="stylesheet" href="#{request.contextPath}/themes/#{layoutBean.theme}/skin.css" />

Upvotes: 3

Related Questions