Install new Share theme via JAR file

cancel
Showing results for 
Search instead for 
Did you mean: 

Install new Share theme via JAR file

mikeh
Active Member II
0 8 6,947

For my presentations at the recent Alfresco DevCons in Paris and New York, I put together a very simple theme modification to style the Share login dialog. The theme was based on our out-of-the-box 'Yellow theme' and very simply replaced the login dialog's background image to look like the picture below:



Login dialog



The interesting bit however, is that I could define a brand-new theme purely through the Spring Surf JAR mechanism; that is by dropping a single JAR file into Tomcat/shared/lib then restarting Share.



This is the process I used:





  • Created a folder called 'devcon-theme'; doesn't matter where.


  • Created the following folder structure within 'devcon-theme'


    alfresco

       site-data

          themes

             devcon.xml

    META-INF

       themes

          devcon




  • Copied the files within share.war!/themes/yellowTheme to the META-INF/themes/devcon folder. It's always a good idea to start from one of our own custom themes, rather than 'default'.


  • Within that devcon folder, use any text editor to open up presentation.css and yui/assets/skin.css and replace .yui-skin-yellowTheme with .yui-skin-devcon.


  • Replaced the images/loginbg.png and images/logo.png with my DevCon-themed versions.


  • The final step is to populate the devcon.xml file with some theme metadata:


    <?xml version='1.0' encoding='UTF-8'?>

    <theme>

       <title>DevCon 2010</title>

    </theme>




 



That's it in terms of customisations (I did say it was a very simple modification!).



The new theme needs to be wrapped up into a JAR file, for which I've got a very simple shell script:



jar cvf $APP_TOMCAT_HOME/shared/lib/$1.jar -C $1 .


..where $APP_TOMCAT_HOME is an environment variable that's set to my Tomcat server where Share is deployed. I've called the script surfjar so I use



surfjar devcon-theme


from the devcon-theme's parent folder.



Remember, if you're using Tomcat 6, you'll also have to configure it to look in the shared folder for these Share extensions. See the wiki article here for details.



Restart Share, login as the admin user and choose More / Application from the main header menu to select your new theme.



You can download the sample devcon-theme.jar file from http://tenthpla.net/alfresco/

8 Comments
blog_commenter
Active Member
Hi Mike!

Great blog.

I tried with latest Alfresco Community Edition, 3.4.d, and when I switch the theme to my new custom theme in More->Application menu item, the new theme is loaded, but after leaving that particular page, the theme is still not applied for the rest of pages. When I come back to More->Application menu item, I notice my custom theme is not selected.

If I place ?theme=customTheme at the end of the URL it does works, but Share doesn't add that param automatically to every page.

I just wonder why the applied theme doesn't save and is applied after it is set?

Thanks in advance.
mikeh
Active Member II
Hi Jonathan

It's a known issue that will be fixed in the next drop of Community. See ALF-6903 for details. You can grab the latest from SVN if you're not running a production system (if you are we'd recommend awaiting a product release).

Mike
blog_commenter
Active Member
Very neat way to add themes, thanks!
I just figured out that you can actually add/override Share's favicon.ico by putting that file in the META-INF dir of the jar. That way it gets picked up by the /res/* handling mechanism.
Just thought I'd share my finding.

Smiley Surprised) Mikkle
blog_commenter
Active Member
Cool way to deploy a theme!
What steps are necessary to remove the theme?
I tried removing the jar file from tomcatlib to no effect after a restart.

The goal is to change the theme. It appears the theme is injected into a war (unclear as to which one) file.
Is the proper approach to clear the war file and restart?

Another alternative I have is to replace the theme. To accomplish that I need to know what identifier within the jar to keep the same.
Dan
mikeh
Active Member II
Hi Dan
Removing the .jar from tomcat/shared/lib is all that's required. Make sure your browser isn't caching the CSS. Anything in a jar file is referenced from there; they're not like AMPs which get injected into the war file.

Thanks,
Mike
blog_commenter
Active Member
Thanks Mike, nice blog!

To solve the changing theme in share issue in 3.4d+

Solved replacing:

share/WEB-INF/lib/spring-surf-1.0.0.CI-SNAPSHOT.jar'
share/WEB-INF/lib/spring-surf-api-1.0.0.CI-SNAPSHOT.jar'
share/WEB-INF/lib/spring-surf-core-1.0.0.CI-SNAPSHOT.jar'
share/WEB-INF/lib/spring-surf-core-configservice-1.0.0.CI-SNAPSHOT.jar'

with Surf RC2 files from http://www.springsurf.org/downloads/1.0.0-RC2/spring-surf-application-1.0.0-RC2.war

share/WEB-INF/lib/spring-surf-core-configservice-1.0.0-RC2.jar
share/WEB-INF/lib/spring-surf-1.0.0-RC2.jar
share/WEB-INF/lib/spring-surf-api-1.0.0-RC2.jar
share/WEB-INF/lib/spring-surf-core-1.0.0-RC2.jar'
mikeh
Active Member II
Thanks Alberto

You should also be able to drop-in the Surf jars from a more recent HEAD build, as they're backward compatible.

Mike
blog_commenter
Active Member
Thank you,
Is the jar used as is? Or is it expanded into a temp space? This would help greatly in debugging..
Thanks
Dan