Customize Images and CSS using themes

Date	2010/04/22
Contact(s)	Mathieu
Last edited	Timestamp
Status	in progress
Assigned to release	2.5.0
Resources	GéoSource [BRGM]
Ticket	#214

Overview

The aim of this proposal is to allow Geonetwork users to easily override images and CSS styles thanks to the theme. Indeed, creating a new directory under the /images/themes/ one, will allow you to create a new theme and to override default images automatically. Creating a new CSS file with the name of the theme will also allow user to override default stylesheet for GUI rendering.

Proposal Type

• Type: GUI Change
• App: GeoNetwork
• Module: Web module

Voting History

• Vote proposed by X on Y, result was +/-n (m non-voting members).

---

Motivations

The current configuration does not allow to easily change defaults images, stylesheets(CSS) without replacing existing ones, or changing name inside XSL stylesheets. This change will allow you to just choose the theme you would like to apply to your geonetwork, then paths to images and stylesheets will automatically be updated. It allows organizations to provide more customization possibilities to their portals.

Proposal

You will be able to choose the theme applied to your application through the administration page -> Configuration system page as illustrated below

This list of theme is automatically populated parsing the themes directory. Then path to images are related to your new theme directory.

Concerning CSS stylesheets, you just have to create your new stylesheet with the name of your theme or just copying/renaming the default one, and then modifying.

With Sample theme	Back to default theme

How to create new theme

• copy the default images files under the images/ directory into your new "Sample" directory under images/themes/
• copy the default CSS stylesheet under css/ directory and rename it as Sample.css
• go to the administration page -> configuration system page, then you can choose in the combo box which theme will be apply to your application

This new feature will also help developers around Geonetwork to easily customize their owns applications without modifying the core code and without loosing compatibility with trunk.

Open Issues

• Overriding or copying CSS stylesheets ?

Risks

Participants

• Mathieu
• François
• GéoSource Sandbox, BRGM
• AKKA IS