Site Overview

Site Structure

All pages of the site (including the pages for the various institutes) are built as part of a single site. This allows the site to share a common catalog of content, including documents, images, etc. To provide individual identities for each institute (including the overall Allen Institute), themes are provided for each, so that those sections of the site may include their own look-and-feel and navigation.

Institute Pages

The site has been built to allow for different operational groups of the Allen Institute to have their own pages and content. For convenience, these are referred to as "Institutes", but this documentation applies equally to other operational groups (such as the Frontiers Group). When pages are added, if they are included within an existing institute section, they will inherit the page theme and institute association of that section, no further work should be required.

Adding a new institute requires both site configuration and additions to the site code. This should be coordinated with a web developer to create the theme for the new institute. The following steps are required to create a new institute:

  1. Define the institute within the admin. This is done in the institute admin. The name, nickname (or code) and logo components (for use in hero images) are defined here. Once this is done, the new institute will become available in the "institute" selection for documents and other forms to associate content with this institute.
  2. Create the institute pages. Pages are created using the standard CMS interface. A single page is enough to get starterd, but this is a good time to layout the basic site map for the new section.
  3. Configure the section root page. This is the "home page" for the institute. In the advanced settings for the institute home page, check the "soft root" box to indicate that this is the root page of the section. In the page menu, navigate to "associated institute" and select the institute that was created in step 1.
  4. Configure the app hooks. To display documents dynamically, hooks to the display apps for articles, press releases, events, staff profiles, etc. will need to be created. The best reference for this is to compare the configuration of the existing app hooks. Each app hook requires a unique name, and uses the institute nickname for link associated documents (for example: 'articles-aibs' is the app hook to display Brain Science Articles).
  5. Create the institute theme. This must be done in code. HTML templates must be created in the ~/templates/themes directory of the site source code. The best reference for this is the existing themes for the other institutes. The existing themes may need to be modified to include references to the new institute in navigation. To complete the themes, CSS styles must be added to the ~/ai/static/css directory corresponding to the new institute colors. The existing theme CSS is the best reference.
  6. Apply the new theme. In the CMS, the templates from the new theme should be applied. For the most part, pages should inherit from parent pages, so not all pages will need to be modified.


The site uses Django-CMS 3.1.5 as the base CMS. Most plugins used in the site are custom to the site. The site uses the Django-Filer file manager wherever possible for better security and file-reusability.

App Hooks & URLs

One key feature of Django-CMS is the ability to assign Django apps to pages. These are referred to as "app hooks". The Allen Institute site uses app hooks to allow the dynamic display of documents (such as Articles). Through the use of apphooks, it is possible to display new articles whenever a new article is created, rather than requiring a new page be created and published each time.

App hooks are configured in the advanced page settings. The same app may be attached to multiple pages, provided that each instance is given a unique name. To create and app hook, create a page as normal, then in the advanced settings, select the appropriate application from the drop list and provide an application id. By convention, the name should be <app name>-<institute code> (for example: "events-aics" or "events-aifg"). This page will now become the template for all documents of that type, so any plugins added to this page are shared with all documents. Note: When a new app hook is created and published, the web server must be restarted before is will appear properly. 

URLs for documents displayed in this way are in the form <path to apphook>/<slug of document>. For example: /what-we-do/brain-science/news-press/articles/introducing-allen-cell-types-database. The URL up to "articles" is the path to the app hook, and the "introducing-allen-cell-types-database" is the slug for that article.