Wilson Mar bio photo

Wilson Mar


Calendar YouTube Github


The most popular

US (English)   Norsk (Norwegian)   Español (Spanish)   Français (French)   Deutsch (German)   Italiano   Português   Estonian   اَلْعَرَبِيَّةُ (Egypt Arabic)   Napali   中文 (简体) Chinese (Simplified)   日本語 Japanese   한국어 Korean


This article lists and evaluates templates for Jekyll, which drives GitHub.io static websites.

The structure of content (.md files) created for display using Jekyll makes it easy (with only a few edits) to switch the site to use any number of other Jekyll themes / templates.

Jekyll Theme shops

My personal favorite is:

Within the Jekyll repository on GitHub:

Premium (paid) themes so you get updates and support, for less than $30.

This is an affiliate for other sites offering the same themes for less.

Jekyll.tips Templates

jekyll.tips/templates lists templates available at https://github.com/CloudCannon.

Bakery-store is in GitHub but not shown in the gallery.


To see responsive websites, get to it quicker on your mobile smartphone QR code is provided for you.

Themes from Michael Rose

Content on this website was created by editing markdown text (index.md files) stored on GitHub.com. The HTML sent to your browser for display is generated from markdown using Ruby running Jekyll 3.0 rendering modifications of the minimal-mistakes theme from GitHub by Michael Rose.

Michael also created the skinny-bones-jekyll theme demo forkable from GitHub. It features more use of graphics, and allows for localization.

Micheal blogs about his themes at https://mademistakes.com/articles/using-jekyll-2016/

A feature comparison:

Feature HPSTR Minimal Skinny Simple
External links YES - - -
Floating menu YES - - -
Gallery layout - - YES -
Localization - - YES -
Multiple authors - YES - -
Page TOC - YES - -
Pages/Articles - * YES YES
Pagination YES - - -
Rakefile.rb YES - - -
Reading time YES - - -
Tags list YES - - -
Site search - - - YES
Social icons only - - - YES
Social names YES - - -
Timezones YES - - -

All the themes feature:

  • YAML front matter in index.md files processed by Jekyll
  • 404.md
  • feed.xml generation
  • Disqus support
  • Use of SASS
  • Theme setup page from the main menu / tab
  • Links to major social sites

Installation and Generation

Michael Rose presents a concise description of how to install the minimal-mistakes theme. This post augments and clarifies it.

Begin by making a folder and populating it on my local machine.

There is both a Master branch and a Develop branch.

I don’t care about all the change history, so I click “Download ZIP” and unzip it into that folder rather than:

git clone https://github.com/mmistakes/minimal-mistakes.git

Grunt example

After downloading, have Maven pull in dependencies based on the Gemfile:

bundle install

This causes the list of dependencies in the Gemfile to be downloaded.

Behind the scenes is a running of the Gruntfie.js that comes with the theme. It defines the parameters of various tasks that are downloaded:

  • clean clears files and folders.
  • jshint validates files with JSHint, based on the .jshintrc configuration file at the root folder.
  • uglify minfies files with UglifyJS.
  • watch runs tasks whenever watched files change.
  • imagemin minifies PNG graphics files.
  • grunt-svgmin minifies SVG graphics files.

NOTE: File names beginning with a dot are hidden.

Gulp example

More on front-end styling

This is one of several topics:

  1. UI Design Systems
  2. Text Editors
  3. Markdown text for GitHub from HTML
  4. 508 Accessibility

  5. gRPC (g___ Remote Procedure Call)
  6. HTTP/2 Transition Project Plan

  7. Front-end UI creation options
  8. Docusaurus static website generator
  9. Static websites
  10. JAM Stack Website Project Plan
  11. Jekyll Site Development
  12. Gatsby app generator

  13. Website styles
  14. Website Styling
  15. VueJs front-end framework

  16. Protractor to automate testing of Angular and other web pages

  17. Email from website
  18. Search within Hyde format Jekyll websites
  19. Windows Tile Pin Picture to Website Feed

  20. Data Visualization using Tableau