Moving my website to Pelican (Static Site Generator)

Since I’m online with my blog, I used my own static site generator (badly written in PHP but it worked) for my website with the goal in mind to reduce the attack surface of my web server.

The security vulnerabilities of dynamic systems like WordPress are just crazy as a check on the CVE Details for WordPress reveals.

So my own, old static site generator took the articles as XML file, transformed it into HTML and built everything ready for an upload to my web server.

After four years I thought it’s time to take a look into something new.

I did some research and I decided to give the Python-based site generator Pelican a “go” because it met all the requirements I have.

The toolchain

Pelican uses Jinja as template engine, which enables to build in some “intelligence” (for/while loops, if/else, and a lot more) for the static HTML generation.

The content is written in Markdown, which makes it easy to concentrate on the text and I don’t have to take care about HTML-tags in XML files anymore.

As front-end framework (for text, buttons, etc.) I’m using UIkit as before, so I don’t have to take care how styles and other functionality is rendered.

The toolchain looks in my case similar to this drawing:

Pelican: Toolchain with Markdown, Jinja and UIkit
Pelican: Toolchain with Markdown, Jinja and UIkit

Development tricks

A big advantage by using Pelican is it looks for changes (modified date/time of files) in the content directory. If a markdown file was changed, Pelican automatically starts the (re-)generation of the static HTML files.

To start Pelican for my development process, I’m using the command:

    # make regenerate
Pelican: make regenerate as easy development process

For development, I skip the minifying of HTML and the optimization of images by commenting those plugins out in the configuration file:

    #PLUGINS = ["tag_cloud", "sitemap", "optimize_images", "minify" ]
    PLUGINS = ["tag_cloud", "sitemap", "minify" ]
Pelican: Plugins used for Development and Publish

To move some static files like “robots.txt” into it’s correct position I’m using in the configuration file EXTRA_PATH_METADATA and STATIC_PATH:

    EXTRA_PATH_METADATA = {
      'extra/robots.txt': {'path': 'robots.txt'},
    }
    STATIC_PATHS = [
      'extra/robots.txt',
    }
Pelican: Moving of static files like “robots.txt”

Pelican-Plugins used

Some notable plugins I use are:

  • sitemap To generate the XML sitemap for search engines

  • tag_cloud To generate a tag cloud in the side navigation

  • minify To minify HTML code and get better loading speed of the website

  • optimize_images To optimize all images and get also a better loading speed

Design changes and other improvements

  • Now each article has share buttons for Twitter, Xing and Share-by-Email. Those are normal links (<a href>) without any API calls or JavaScript of those service providers.

  • The side navigation has now an archive by year and a colored tag cloud.

  • The source code boxes are better presented (in my option) by using a dark background.

  • Icons and links for RSS/ATOM feed, Twitter, Xing and Github are now in the footer.


Share: