SparrowX is a clean, minimal, SEO-friendly Jekyll theme you can download right now. It is 100% Netlify compatible. Updated demo link - https://sparrowx.netlify.com
The SparrowX
So, I've been testing Netlify last week and came across Netlify CMS. The CMS is pretty easy to set up, and it'd be a wise choice for people who don't want to spend money on hosting.But SEO... yeah that's a problem when it comes to Jekyll themes. Sure, you can optimize Jekyll a lot, but it's hard for people with no development knowledge to setup Jekyll + Netlify CMS manually.
My search for a clean, minimal Jekyll theme ended when I found sparrow on GitHub. Developed by lingxz, it's a solid theme that can be used as a boilerplate.
So I took the base theme, improved loading speed, added many features for SEO and made it to a Jekyll + Netlify-CMS boilterplate.

Legacy Features
- Fully compatible with Github Pages
- Configurable and responsive multi layer menu, adapted from slimmenu
- Disqus integration
- Font Awesome icons included
- Google analytics
- Social sharing using rrssb
- 404 page included
- Typographic optimization for Chinese fonts
- Atom feed generated with jekyll-feed
- Pagination enabled for blog using jekyll-paginate
- Basic SEO with Facebook Open Graph tags and Twitter cards
New Features
- Fully compatible with Netlify CMS (one-click setup).
- Added new custom variables like updated, headerimage, feature-img, sitemap and tag.
- The theme renders system font-stack.
- Compressed JS.
- Improved load time and reduced file requests.
- _redirects feature
Website Speed Test

How To Use This Theme
Visit this page to read the SparrowX documentation for Netlify CMS.Install
Just fork this repo and replace the posts with your own. Also, rename the sample poetry collection to replace it with your own collection, or just delete it if you don't need to use collections. The example is poetry, but you can easily revamp this into essays, short stories, portfolio, or whatever your creative work is.Customize these values in the General configuration
_config.yml
file:
title : "SparrowX"
description : "A clean minimal Jekyll theme for SEO-focused writers."
favicon : "/assets/images/image.png" # You can use base64 encoded images.
url : "https://sparrowx.mighil.com" # the base hostname & protocol for your site e.g. "https://mmistakes.github.io"
baseurl : "" # the subpath of your site, e.g. "/blog" leave blank if no subpath
# Site Author
author:
name : "Mighil" # appears in the footer and atom feed
To activate Disqus, fill in your disqus shortname: Disqus
comments : true # set it to false to disable comments
disqus:
shortname : your_shortname
Enable google analytics by filling in your tracking ID: Google analytics
analytics:
google:
tracking_id : # add your google tracking id here
If you are using collections, be sure to replace this with your collection name: Collections
collections:
poetry:
output: true
permalink: /:collection/:title/
Currently, pagination is set to a the blog page. Unfortunately Jekyll does not yet support pagination on multiple pages. Pagination
If you want to paginate on a different page, simply change the paginate_path
value in the config file and create the relevant page.
paginate: 5 # amount of posts to show
paginate_path: "/blog/page:num/"
timezone: # http://en.wikipedia.org/wiki/List_of_tz_database_time_zones
You can change the navigation links in Navigation
_data/navigation.yml
.
At the bottom of the config file, you can also set Front matter defaultsfront matter defaults so that you don't have to repeat the same front matter for every post. This is an example:
# Front matter defaults
defaults:
# _pages
- scope:
path: ""
type: pages
values:
layout: page
comments: false
# _posts
- scope:
path: ""
type: posts
values:
layout: post
comments: true
share: true
# _poetry
- scope:
path: ""
type: poetry
values:
layout: post
share: false
You should create specific .md files within How tags work
/tag/
before using the variable.
To enhance SEO, you can add your twitter username to Other Stuff
_config.yml
.
You can also add an image path for the og_image
value in the config file, for a default open graph sharing image. This value can be overridden in individual posts by using headerimage variable.
Your default image Netlify CMS uploads will go to /images/.
For the various config options see the sample config file for the demo site
The color schemes and fonts can also be customized through scss, by editing the relevant variable in _variables.scss
.
Getting Started on Netlify CMS
Visit this page to read the SparrowX documentation for Netlify CMS.- Create a Netlify account if you don't have one.
- Fork SparrowX. (No need enable GitHub pages since we'll be using Netlify CMS to fetch, build the repo and point the domain.)
- Visit https://app.netlify.com/ and click "New site from Git"
Netlify deploy settings for SparrowX
- Select
master branch
to deploy. Usejekyll build
build command and set the Publish directory as_site
.

The /admin/ directory contains the /admin/ directory explained
index.html
and config.yml
for Netlify CMS.
Here's how the config.yml
looks for now.
backend: name: git-gateway branch: masterpublish_mode: editorial_workflow
media_folder: "images" # Media files will be stored in the repo under images public_folder: "/images" # The src attribute for uploaded media will begin with /images
collections:
-
name: "post" label: "Post" folder: "_posts" create: true slug: "{{year}}-{{month}}-{{day}}-{{slug}}" fields:
-
{label: "Type", name: "type", widget: "hidden", default: "post"}
-
{label: "Title", name: "title", widget: "string"}
-
{label: "SEO Title", name: "seotitle", widget: "string"}
-
{label: "Author", name: "author", widget: "string"}
-
{label: "Description", name: "description", widget: "string", required: false}
-
{label: "OG Image", name: "headerimage", widget: "string", required: false}
-
{label: "Updated Date", name: "updated", widget: "string", required: false}
-
{label: "Body", name: "body", widget: "markdown", required: false}
-
{label: "Tags", name: "tags", widget: "string"}
-
{label: "URL", name: "url", widget: "string"}
-
name: "page" label: "Page" folder: "_pages" create: true slug: ".md" fields:
-
{label: "Type", name: "type", widget: "hidden", default: "page"}
-
{label: "Title", name: "title", widget: "string"}
-
{label: "SEO Title", name: "seotitle", widget: "string"}
-
{label: "Description", name: "description", widget: "string", required: false}
-
{label: "URL", name: "url", widget: "string"}
-
{label: "Body", name: "body", widget: "markdown", required: false}
You may edit this according to your preference.The Netlify CMS Dashboard
The dashboard looks the way as configured onconfig.yml
inside/admin
.
Here are the basics:
Go ahead and test SparrowX if you've time. Thanks for reading.