Templating intermediate

Templating is used to customize mainly a large portions of the user interface and/or to change page layouts, or to create a completely new pages for the Invenio repository.

Changing The Templates

What templates are used to render which pages, is determined mostly by Invenio site configuration. It is a common convention that configuration options regarding the templates usually contains the _TEMPLATE suffix in the name.

Jinja templates are .html files with Jinja syntax. Any custom templates should be created and placed under the registered templates folder.

Template Inheritance And Composition

It is a common practice to compose the final page from one or more templates by leveraging Jinja's Template inheritance (opens in a new tab) mechanism.

Usually you would have a base page template (opens in a new tab), which provides just the overall page layout and a few extension points (e.g.: {% block header %}). Other templates inheriting from it ({% extends "base.html" %}) could then extend the base template by providing their own content for the extension points. (e.g. by providing a header text for the header block).

Referencing Templates

Template references (either in Invenio site config, or when referenced from other templates) are resolved as paths relative to the registered templates folders. For example with this file structure:

wherever I'd like to use myfooter.html template, I would refer to it as custom/myfooter.html.

Example

Advanced Templating with JinjaX

In NRP-based Invenio repositories, apart from using regular Jinja macros, it is possible to use and create a reusable Jinja snippets / components with a clearly defined interface of accepted properties (usage is similar to React UI components) by using the JinjaX (opens in a new tab) extension.

You can recongnize JinjaX components by the camel-cased filename, .jinja file extension and usually the:

{# def message="hello world!", ... #}

properties definition header.

This article only describes, how you can customize or change the templates used across the repository site. If you wish to learn more about development of own custom templates and JinjaX components, have a look at: