Changing the appearance of your Ensembl website
Here at the Ensembl project, in addition to www.ensembl.org we run many different websites based on Ensembl code, including public sites such as pre! and the Ensembl archives, and private sites used for internal development. In order to distinguish these sites we use plugins to alter the colour scheme and/or site logo, in addition to the changes in content. For example pre! is green, and the archives are light brown.
You may find it useful to do something similar with an Ensembl mirror, so that your users know they are looking at a local copy and not the actual Ensembl site.
In the examples below, we'll assume that you are adding these changes
to the normal
Important note: if you make any changes to .ini files,
you need to remove
/conf/config.packed before restarting the
server, to ensure your changes are recompiled.
Changing the site logo
The Ensembl logo graphic can be found in
First you should make a directory
and copy your logo into it. Ideally your logo should be around 40 pixels high, so that it does not break the template layout.
You will then need to add the following lines to
substituting the appropriate parameters:
[ENSEMBL_STYLE] SITE_LOGO = e-ensembl.gif SITE_LOGO_ALT = Ensembl Home SITE_LOGO_WIDTH = 150 SITE_LOGO_HEIGHT = 40 SITE_LOGO_HREF = /
SITE_LOGO_HREF parameter is only needed if your Ensembl mirror does not occupy the root
of the host domain - omit this line to use the default link "/"
Changing the colour scheme
The colour scheme can be altered by adding the following to
(you can omit the [ENSEMBL_STYLE] header if you already have
a custom logo defined, as above):
[ENSEMBL_STYLE] MAIN_V_DARK = 333366 MAIN_DARK = 7b8baf MAIN_MEDIUM = b0bbd8 MAIN_LIGHT = dadff1 MAIN_V_LIGHT = eef0f7 CONTRAST_DARK = ffc107 CONTRAST_MEDIUM = fff6cc CONTRAST_LIGHT = fffae6 BLACK = 000000 V_DARK_GREY = 333333 DARK_GREY = 666666 MEDIUM_GREY = 999999 PALE_GREY = cccccc LIGHT_GREY = eeeeee V_LIGHT_GREY = f0f0f0 WHITE = ffffff ## For usability, use site colours if possible, otherwise blue/dark blue/red choices that look OK with site colours LINK = 697ec9 VISITED = 33478c HOVER = cc3600 HOVER_REVERSE = ff7f50 SEVERE_DARK = b32d00 SEVERE_LIGHT = ffece6 MODERATE_DARK = e6b000 MODERATE_LIGHT = fff3cc OK_DARK = 009933 OK_LIGHT = e6ffee
Simply alter the hex values to the colours you want. These placeholder values will be compiled into the Ensembl css files on server startup.
Note: we recommend not changing the font sizes, or you may have problems with your graphics!