kiko-minus is a minimalistic Jekyll theme based on kiko-plus.
While the design and styles are largely inherited from the original theme, kiko-minus strips away heavy dependencies like Google Analytics and Disqus in favor of lightweight alternatives. It comes with many additional features with an emphasis on privacy and speed, including automatically compressed images, gzip compression, and SEO optimization.
- Ready for use with GitLab or GitHub pages
- Syntax highlighting
- Automatic image compression
- Zopfli compression (gzip)
- Fully responsive
- Automatic sitemap generation
- Filtered pagination based on tags & collections
- Private comments with ISSO
- Analytics with Fathom
- Automatic Atom feed
- Structured data support (TODO)
You can use kiko-minus on your site after scaffolding with
Add this line to your Jekyll site's
Copy this configuration to your site's
And then execute:
Or install it yourself as:
$ gem install kiko-minus
Finally, make sure to follow the directions below to enable pagination on your home page.
kiko-minus has an assortment of components to minimize additional needed configuration, so that all you need to do is add your posts to
_posts/ and be ready to go.
default.htmldefines the basic structure of every page, including SEO tags, stylesheet imports, and favicons.
home.htmlis used for the index page, and includes a navigation bar and the paginated list of all posts.
page.htmlis used for individual pages i.e. an About or Contact page.
post.htmlis for your blog posts, and can include a comment section if ISSO is enabled.
filtered-home.htmlis meant to be used for filtered post lists i.e. pages listing all posts belonging to a category or tag. The sample wikipedia page is an example use case to show all posts that are Wikipedia articles.
archive.htmlshows a condensed view of many posts and their publishing dates.
footer.htmlis put at the bottom of every page to show copyright information.
post-list.htmlrenders out a list of posts as defined by pagination.
isso.htmlcontains the ISSO script tag and is included if comments are enabled. The tag also includes many of the configurable options as defined here.
fathom.htmlcontains the tracker code and is included if analytics are enabled. The tag requires the address of your server and the site ID as provided by your Fathom instance.
kiko-minus.scss defines the main variables to be used in the rest of the styles, as well as a couple mixins to help make the site responsive. It also imports the rest of the partials.
_colors.scssis copied from Open color and defines a broad palette for easy use.
_layout.scssdefines the overall structure of the site.
_normalize.scssis copied from Normalize.css and is used to render the site consistently across all browsers.
_syntax-highlighting.scssdefines how code is highlighted.
_typography.scssdefines the look and feel of the elements on the site.
css/contains a single
style.scssfile that imports the rest of the base kiko-minus styles. This is also where custom stylesheets can go, as explained below.
img/is where your images will go for use throughout the site. You can add subfolders here as is done in this sample to better organize. Be warned that the photos here will be optimized in place, and that the originals will be copied over to
assets/img_archive(or as otherwise defined in your config), which isn't included in your website's build.
.image-optim-cacheis used by the image optimization plugin to keep track of what files have already been optimized. Do not delete this!
tags/can be used to define category or tag filtered pages.
pages/can be used for individual pages.
index.mdis the home page for your site.
index.md and any other post list pages that you want paginated (such as category and tag pages), you'll need to add some configuration to each page's front matter. At the very least, you will need the following:
For more configuration options, you can read the plugin's docs.
To add your own stylesheet, uncomment the
css entry in
_config.yml, and add the location of the stylesheet as its
To enable comments on your posts, set
true in your
_config.yml, and add the location of the embed script as hosted by your ISSO server to
isso.script_src. The other options can be deleted if you want the defaults as defined on ISSO's website.
To enable analytics throughout the site, set
true in your
_config.yml, and add the location of the tracker script (i.e. https://yoursite.tld/analytics/tracker.js) to
fathom.script_src and your site ID to
If you don't know the location of the script and site ID, you can look at the tracking code provided on your Fathom dashboard:
})(document, window, '//mysite.dev/analytics/tracker.js', 'fathom');
fathom('set', 'siteId', 'ABCDE');
In this case, the script is hosted at https://mysite.dev/analytics/tracker.js, and its site ID is ABCDE.
If configured, kiko-minus will automatically create gzipped versions of your text files that will be served by default if GitHub or GitLab pages, or if otherwise configured on your host. As explained in the plugin's usage, the site must be built in production mode to create the gzipped bundles by setting the
JEKYLL_ENV environment variable as such:
JEKYLL_ENV=production bundle exec jekyll build
This is done because creating the bundles can be slow, and so should only be done in production mode.
Category and Tag Pages
The plugin jekyll-paginate-v2 lets us paginate on categories and tags (and much more!). The directions for enabling pagination can be found in their docs, and an example is provided here with wikipedia articles page. It is highly recommended that you use the
filtered-home layout for these pages.
kiko-minus supports including a 16x16 and 32x32 px favicon for your site. Place them in the
assets/img/logos/ directory with the names
favicon-32x32.png, respectively, and they'll automatically be loaded.
This theme uses
jekyll-seo-tag to help provide metadata to improve your SEO scores. You can supply information to the
_config.yml as defined here (many of the options are already added to the config you copy over from this theme).
Bug reports and pull requests are welcome on GitHub at https://github.com/ask616/kiko-minus/issues. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the Contributor Covenant code of conduct.
To set up your environment to develop this theme, run
Your theme is setup just like a normal Jekyll site! To test your theme, run
bundle exec jekyll serve and open your browser at
http://localhost:4000. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.
When your theme is released, only the files in
assets/css tracked with Git will be bundled.
To add a custom directory to your theme-gem, please edit the regexp in