Zola Theme : Course
This theme allows you to publish only courses/tutorials structured in parts and subparts, using Zola.
It automatically links pages of the course with the next and previous ones for easy navigation. There is also a navigation bar at the top of each page to easily navigate the whole tutorial, and for the reader to never be lost.
Each page can have an illustration.
It lets you customize some parts of the site, like the color palette.
It also features a light/dark mode switcher.
It also has some SEO features.
It was made for french courses, so a few parts of the interface may be in french.
You can easily adapt it to your language by editing the files in themes/zola-theme-course/templates/.
Usage
Create your Zola site, and import this theme:
zola init NAME
cd NAME/themes
git clone https://github.com/elegaanz/zola-theme-course.git
cd ..
Then update your config.toml with this line:
theme = "zola-theme-course"
You can also add these lines to customize how the theme behaves:
[extra]
site_name = "My course"
icon = "image.png"
icon_desc = "Icon of the course"
description = "A great course!"
default_illus = "illus.png"
primary_color = "#FFFFFF"
accent_color = "#FFFFFF"
source_url = "https://github.com/me/my-course"
File structure
For your course to be displayed correctly, it needs to follow a specific structure.
content/_index.mdis the text displayed on the homepage- each part should have its own folder, with an
_index.md - each subpart should have its own markdown file (which can be an
index.mdin a subfolder) - all
_index.mdfiles should havesort_by = "weight"in their frontmatter, and you can then order parts and subparts using theweightoption.
With this theme, pages can also have extra options:
[extra]
# Don't display the page title, useful for the homepage
no_title = true
# The name of the image to use as a banner
illus = "illus.jpg"
# Adds JSON-LD metadata on this page, useful for the homepage
jsonld = true
The standard title and description fields are also taken into account.