This is the title of the page!

This is the subheading for a short article written with markdown

This is the article body

You can write another paragraph here by double spacing.

You can also write out code blocks in the markdown file:

def myfunction():
    return 'Hello'

It was dynamically added to the page by passing a variable to the template with the same name as the markdown file! To include short bits of markdown in your template like this, simply add the markdown file to markdown/partials, and the variable will be exposed to all templates. You can render it in the template using the jinja variable syntax:

{{ name_of_markdown_file }}

Variable Prefixes for Markdown Content

In order to avoid any naming conflicts, The articles further nested in directories within "articles/partials/" will have a variable prefix that is the accumulated names of the preceding directories in dot notation (excluding '/partials' and higher).

For example, a markdown file located in markdown/partials/collections/quotes/my_quote.md, will be exposed to all templates with the following variable using the jinja variable syntax:

{{ collections.quotes.my_quote }}

Article Pages

In addition to partial variables that can be included in templates, entire new pages can also be automatically be generated from markdown files added to the markdown/articles directory, like this example. The path will match what is defined in the markdown/articles directory, and reusable layout wrapper templates can be defined in views/articles by adding a layout.jinja file under the desired directory that matches the path defined in markdown/articles. In the layout.jinja file, control where you would like your content to be dynamically inserted by passing in the reserved {{ article }} variable. Click on the example to learn more.

CSS

You can create as many css files as you'd like, and no need to import them, because they will all be compiled into a single css file during the build process.

Data Store

For easy configuration and keeping repeated values in one place, JSON data in the /store directory will be passed to Jinja templates with an identical variable to the property name. Each nested object can be accessed using dot notation in the templates.

For example, to access the title value from /store/config.json:

{
    "metadata": {
        "title": "Shodo - A Static Site Generator",
        "description": "Generates a static site",
        "author": "Shodo"
    }
}

in the template, you would use the following syntax:

{{ metadata.title }}

Partial Templates

This is another jinja2 template, separate from the main layout!

You can use these for keeping things like headers, footers, and sidebars separate from the main layout.

Macro Templates

Macro templates can be used to dynamically loop through lists of data

These are ideal for rendering several items in a single format, such as portfolio projects, events, a list of links, or whatever you'd like!

Here is an example:

  • This
  • is
  • content
  • that
  • was
  • dynamically
  • looped
  • through
  • using
  • Jinja
  • Macros!

JavaScript

Getting Started

Get started by editing src/theme/views/home.jinja and then running Python serve.py to build your static site in the dist/ directory and start up the development server!