Adding HTML pages to your Ensembl website

The main htdocs/info directory contains all the technical documentation needed for an Ensembl mirror. However you may want to add your own pages, such as contact information for your project or general documentation that applies to all species.

Navigation

In order to avoid spending time maintaining navigation of static pages, the Ensembl code includes automated navigation. This is implemented as follows:

  1. At server startup, the module EnsEMBL::Web::ConfigPacker parses the entire document tree for htdocs/info/ in all plugins, to produce a combined tree for the whole site
  2. This tree is then used to generate site navigation:
    • A menu on the left of each page shows up to two levels of pages adjacent to your current position
    • A "breadcrumb trail" is constructed from the relevant path through the tree

In order to take advantage of this functionality, you simply need to make sure that you place your documentation in the htdocs/info directory of your plugin, and follow these simple rules when formatting your HTML files:

  • Use the file extension .html - other file types are ignored
  • Follow our HTML best practices - HTML Quick Reference
  • Omit templating and navigation - that is all handled by the web code
  • Include a <title> tag
  • On index pages, if the title is longer than a couple of words, consider using a "navigation" meta tag (see below)

Sample file:

<html>
<head>
<title>About This Project</title>
</head>

<body>
<h1>About This Project</h1>

[Your content here]

</body>
</html>
Note that if you add or remove a static page, or change anything within the <head> tag, you need to delete /conf/packed/web_tree.packed and restart the server.

Omitting content from the navigation

There may be instances where you do not wish to have ConfigPacker parse sections of the tree. For example, we do not include the contents of 'Doxygen' in the Ensembl documentation tree as it contains many hundreds of files and has its own navigation menu.

To omit part or all of a directory from the tree, use the "index" meta tag as follows:

  • To omit an entire directory, put the "index" meta tag in the index.html file header and set its value to "NO INDEX"
  • To include the index file but not other HTML files or subdirectories, put the "index" meta tag in the index.html file and set its value to "NO FOLLOW"
  • To omit an individual HTML file, put the "index" meta tag in its header and set the value to "NO INDEX"

Sample file:

<html>
<head>
<title>PDoc Documentation</title>
<meta name="index" content="NO FOLLOW" />
</head>

<body>
<h1>Ensembl PDoc Documentation</h1>

[rest of page]

</body>
</html>