Overview

To customize the look and feel of a specific page you have to modify the corresponding template. Each page has its main template and each template can have multiple smaller templates (called partials) used inside of it. Here's an example:

catalog.html.liquid
├── _header.html.liquid
├── _sub_navigation.html.liquid
├── _courses_filter.html.liquid
│   └── _filter_select.html.liquid
├── _courses/catalog.html.liquid
└── _footer.html.liquid

The catalog.html.liquid file is the main template for the Catalog page. Inside that template, there are multiple partials that construct the whole UI. Partials allow reusing parts of the template and provide a way to structure your customization code.

📘

Please note that the structure above represents the way the templates are included in one another, not the structure of folders from the zip file.

Quick start

In order to customize the templates of your academy, you will first need to install a theme version. In most cases, once a theme is installed, your academy will no longer receive automatic feature enhancements or updates to the Learning Experience.

1. Install the latest theme from the Northpass Admin panel.

Go to the Design tab in the Admin panel and then to Themes & Templates. Click the Install Theme button. Only the latest theme version can be downloaded.

2. Download your academy's default templates

Click the download icon in the Templates section. This will download a .zip file of all templates available in your academy.

2. Unzip the downloaded file and open the folder with templates in your favorite code editor.

You should see a list of all main templates and their partials.

3. Modify the templates to your liking.

Unleash your creativity! You can use any combination of HTML, CSS, and JavaScript to provide the best user experience to your learners.

4. Upload the templates using the Northpass Admin panel.

After you make changes to selected base templates, you should upload them to the application. Go to the Design tab in the admin panel and then to Themes & Templates.

Click the Upload button and select the template(s) you have modified. Changes are saved automatically.

❗️

Once you install a theme, we won’t support automatic updates with additional features that Northpass makes to the base templates. You will need to merge the changes into your templates directory. Additionally, we will not be able to support the look and feel of your website.