GitHub Pages boilerplate

Jekyll boilerplate for GitHub Pages (no plugins) does the every-time-new-static-site groundwork for you.

Featuring:

skeleton layout
multilanguage support
Normalize.css & box-sizing: border-box; & font antialiasing
smart page title generator
sitemap and robots.txt generator
basic favicon support
Google Tag Manager support
support for preconnect, prefetch & prerender

Features

Skeleton layout

Skeleton layout handles the basic HTML file structure, especially assembling the head. All you need to do is create Markdown files.

Body classes and inline styles

It is possible to add classes or inline styles to the body tag. Just add body_classes or body_inline_styles variables (or arrays) in YAML front matter:

body_classes: homepage
body_inline_styles:
  - 'color: blue;'
  - 'font-family: sans-serif;'

Multilanguage

This boilerplate handles multilanguage for you. If you have a site with only one language, you don't have to care: just fill in your (only) language code in config.yml:

language: en # ISO 639-1 language code

To use multilanguage, add list of supported languages to _config.yml:

language: # ISO 639-1 language code
  - en # first language in the list is default
  - cs

First language is taken as default and used as fallback if the required language version is not available.

Then add all language versions instead of one string. For example for site title:

title:
  en: '**GitHub Pages** boilerplate' # feel free to use Markdown
  cs: 'Boilerplate pro **GitHub Pages**'

Correct language version according to the page language is then rendered.

Page language is set in YAML front matter of the page:

---
language: de
---

…

Page title generator

The site title (either set in YAML front matter or first heading in Markdown) is automatically prepended to the site title.

You can turn off this behavior or change the delimiter in _config.yml:

page_title:
  append: true # site title will be appended after page title (if set)
  delimiter: '—' # optional delimiter, | (pipe) is default

Sitemap and robots.txt generator

Sitemap is automatically generated by jekyll-sitemap.

Also robots.txt file is automatically generated – unless site is running in production environment (variable is set in _config.yml):

environment: production # if not production, all URLs will be disallowed for crawling

all URLs are disallowed for crawling, including noindex meta tag.

Favicon

You can easily add favicon just by placing any of those files:

/favicon.ico (recommended) or /assets/global/favicons/favicon.ico
/assets/global/favicons/16px.png
/assets/global/favicons/32px.png
/assets/global/favicons/48px.png
/assets/global/favicons/96px.png
/assets/global/favicons/96px.png
/assets/global/favicons/192px.png

You can use RealFaviconGenerator to generate the images.

Google Tag Manager

You can use Google Tag Manager for setting up Google Analytics and possibly adding other tracking codes. Simply put your container ID in _config.yml:

gtm_container_id: GTM-O3A98T7

Preconnect, prefetch and prerender

You can use preconnect, prefetch and prerender links to make your site faster (learn more about it). Simply add following to the YAML front matter:

pre:
  - url: 'https://google.com'
    type: preconnect
  - url: 'https://seznam.cz'
    type: preconnect

Updating

If you want to update to the latest GitHub Pages Boilerplate, you can simply pull latest master from this repository and merge it to your code.

The following commands will try to merge all changes within one commit, but you will probably have to sort out some conflicts:

git remote add gh-pages-boilerplate git@github.com:cloudaper/gh-pages-boilerplate.git
git fetch gh-pages-boilerplate
git checkout -b gh-pages-boilerplate gh-pages-boilerplate/master
git checkout master
git merge gh-pages-boilerplate --squash --allow-unrelated-histories

cloudaper / gh-pages-boilerplate