Table Of Contents

Previous topic

Keyword Search

Next topic

Region Search

This Page

General Layout

This page describes how to customise the look & feel of the whole InterMine webapp.

Parts

Favicon

Favicon (icon seen next to the url of the webapp in the browser url bar) can be set by adding the following line:

<link rel="shortcut icon" type="image/x-icon" href="model/images/favicon.ico">

Into the webapp/resources/webapp/layout.jsp file and its </head> section. The favicon itself should be located in <your_mine>/webapp/resources/webapp/model/images/favicon.ico.

If you want to generate a favicon from an image, use this Dynamic Drive tool.

Other properties

project.sitePrefix
in Database and Web application configures the link
project.title
in Database and Web application configures the name of the mine
project.releaseVersion
in Database and Web application configures the version of the mine
project.subTitle
in Database and Web application configures the subtitle showing in the header
header.links
in Features configures the links in upper right corner

Changing look and feel, the theme

InterMine provides a set of default themes but you can also create your own. All themes are defined in intermine/webapp/main/resources/webapp/themes/*. Explore the folder to see the themes available.

To switch a theme edit Features:

# web.properties
theme = purple

You need to change this property to the name of the theme you want to use (the directory name), then re-release the webapp. Be sure to run ant-clean to ensure that all of the old files are deleted:

# in <your_mine>/webapp/resources/webapp
$ ant clean
$ ant default remove-webapp release-webapp

Developing your own theme

With CSS knowledge and open source image software such as Gimp or Inkscape you can develop your own theme. Each theme directory contains a theme.css file, which is broken down in annotated sections, and image files. The image files are required for displaying menus, headers and backgrounds and can be modified with image software to match your colour scheme. Create a new directory under intermine/webapp/main/resources/webapp/themes/, copy the contents of another theme directory into it and start editing.