General Layout

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



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/src/main/webapp/model/images/favicon.ico.

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

Other properties

in Database and Web application configures the link
in Database and Web application configures the name of the mine
in Database and Web application configures the version of the mine
in Database and Web application configures the subtitle showing in the header
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 /themes directory in InterMine. Explore the folder to see the themes available.

To switch a theme edit Features:

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 ./gradlew clean first to ensure that all of the old files are deleted.

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 webapp/src/main/webapp/themes, copy the contents of another theme directory into it and start editing.