Add custom theme primefaces

Posted: May 18, 2012 in web

create custom theme at http://jqueryui.com/themeroller/, download and uncheck all components.

from

http://primefaces.googlecode.com/files/primefaces-3.2.zip

1) The theme package you’ve downloaded from ThemeRoller will have a css file and images folder.
Make sure you have “deselect all components” option on download page so that your theme only
includes skinning styles. Extract the contents of the package and rename jquery-ui-
{version}.custom.css to theme.css.

2) Image references in your theme.css must also be converted to an expression that JSF resource
loading can understand, example would be;
url(“images/ui-bg_highlight-hard_100_f9f9f9_1x100.png”)
should be;
url(“#{resource[‘primefaces-yourtheme:images/ui-bg_highlight-hard_100_f9f9f9_1x100.png’]}”)
Once the jar of your theme is in classpath, you can use your theme like;

web.xml
<context-param>
<param-name>primefaces.THEME</param-name>
<param-value>yourtheme</param-value>
</context-param>

“Applying your own custom theme is same as applying a pre-built theme however you need to
migrate the downloaded theme files from ThemeRoller to PrimeFaces Theme Infrastructure.PrimeFaces Theme convention is the integrated way of applying your custom themes to yourproject, this approach requires you to create a jar file and add it to the classpath (IMPORTANT: went to project build path at first and a external jar and it did NOT work :), instead I just copy jar file to ../WEB-INF/lib/ on my current project and wallah!) of your application.

or

“If you’re wanting to include a JAR file to your Eclipse project, you would generally create a ‘lib’ folder inside the project folder, and put the file in there. You then need to tell eclipse to include it in your class path so your code will compile and run inside eclipse.

– Go into the properties of your project
– Select ‘Java Build Path’ in the left hand column
– Select the ‘Libraries’ tab in the centre part of the window
– Click the Add JARs button – this will give you a list of your projects in eclipse – expand your project and into the lib folder – your jar will be there.
– Select the JAR, click OK, and OK again out of the properties window.

Your code will now compile and run.”

 

Jar file must have the following folder structure. You can have one or more themes in same jar.

– jar
– META-INF
– resources
– primefaces-yourtheme
– theme.css
– images”

creating a jar file (goto to your jar folder and do a “jar cf jar_name.jar *.*”)

http://java.sun.com/developer/Books/javaprogramming/JAR/basics/build.html

Advertisements
Comments
  1. bhanu says:

    how can create above mentioned structure for jar file.please give me help.

  2. Hjelperne says:

    Excellent tool for converting ThemeRoller to PrimeFaces themes:

    https://themeroller.osnode.com/

    Maven instructions included

  3. Hi there! I know this is kind of off topic but I was wondering which blog platform are you using
    for this site? I’m getting sick and tired of WordPress because I’ve
    had issues with hackers and I’m looking at alternatives for another platform.
    I would be awesome if you could point me in the direction
    of a good platform.

  4. tesr says:

    My developer is trying to persuade me to move to .net from PHP.

    I have always disliked the idea because of the costs.

    But he’s tryiong none the less. I’ve been using WordPress
    on various websites for about a year and am worried about switching to
    another platform. I have heard good things about blogengine.net.
    Is there a way I can transfer all my wordpress posts into it?

    Any help would be really appreciated!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s