Juan Pablo Salado

Tech enthusiast immersed in a continuous process of personal and professional development.

1 minute read

This post provides basic reference for applying the minimal mistakes theme to a Jekyll site.

Jekyll Themes

When you create a new Jekyll site (by running the jekyll new <PATH> command), Jekyll installs a site that uses a gem-based theme called Minima. But you can modify it!

Jekyll has an extensive theme system that allows you to leverage community-maintained templates and styles to customize your site’s presentation. Jekyll themes specify plugins and package up assets, layouts, includes, and stylesheets in a way that can be overridden by your site’s content.

Minimal Mistakes

The theme used in this website is called Minimal Mistakes and was designed by Michael Rose. It is a flexible two-column Jekyll theme, perfect for building personal sites, blogs, and portfolios. As the name implies, styling is purposely minimalistic to be enhanced and customized by you.

Among other things, this theme provides:

  • Google Analytics support.
  • Commenting support (currently powered by Disqus, Facebook, Google+, Discourse, static-based via Staticman, utterances, and giscus).
  • SEO optimization.
  • A built-in SCSS processor.

Learn more about this theme at its official site.

Setup

In order to install it, we can add the following statement to our Gemfile.

gem "minimal-mistakes-jekyll"

Then, go out and install the gem in this gemfile by running the following command.

bundle install

Watch out! Migrating to a new time may cause that some layouts used by previous themes are no longer supported, as old layouts may not be present in the newer theme.

Next steps

Quite easy right? Now you are ready to go with your new theme! Still, you should definitely check the official docs so you can properly configure this theme. I recommend starting with the _config.yml reference, which explains the basics of this theme and lets you configure powerful stuff as Google Analytics support or a plugin that allows comments in your website.

Note: If you intend to use it with GitHub Pages, make sure you follow the remote theme configuration.

References

Leave a comment