Jekyll Skeleton Save

Scaffolding to start with a Jekyll website

Project README


Build Status

Jekyll scaffolding to start new websites.

Table of Contents


This is a basic Jekyll site created with jekyll new --blank (without themes, or example posts) to serve as a starting point for any website.

Its purpose is to quickly start new websites cloning this repo and customizing to your needs, having already all the features I was adding and configuring every time I created a new Jekyll instance.

Live demo looks so "minimalistic" because it does not use any theme and its only goal is to show the design of the website navigation and how to add posts/categories.

Its structure uses the design described in How To Add Bootstrap 4 To Jekyll The Right Way, Multilingual Jekyll Without Plugins and How To Implement Breadcrumbs On A Jekyll Site With Nested Categories articles applied on a blank Jekyll instance with the suggestions provided by the plugins below.

Just clone this repo and start building yours.

git clone [email protected]:marcanuy/jekyll-skeleton.git


  • Automatically generates at each jekyll build:

  • SASS and easy customization of Bootstrap 4 variables in /assets/main.scss and /_sass/_variables.scss.

  • Automatically adds metadata tags for Search Engines and Social Networks

    • Page title, with site title or description appended

    • Page description

      	<meta name="description" content="..."/>
    • Canonical URL

      <link rel="canonical" href="..."/>
    • Next and previous URLs on paginated pages

    • JSON-LD Site and post metadata for richer indexing

      <meta property="fb:app_id" content="1822851531277021"/>
      <script type="application/ld+json">
      {"@context": "",
      "@type": "WebPage",
      "headline": "...",
      "description": "...",
      "url": "..."}</script>
    • Open Graph title, description, site title, and URL (for Facebook, LinkedIn, etc.)

      <meta property="og:title" content="..."/>
      <meta name="description" content="..."/>
      <meta property="og:description" content="..."/>
      <meta property="og:url" content="..."/>
      <meta property="og:site_name" content="..."/>
      <meta property="og:type" content="..."/>
      <meta property="article:published_time" content="..."/>
      <meta property="fb:app_id" content="..."/>
    • Twitter Summary Card metadata

      <meta name="twitter:card" content="summary"/>
      <meta name="twitter:site" content="..."/>
      <meta name="twitter:creator" content="..."/>
    • Multilanguage

      • Language navigation menu for each page to all the other translation versions

          <a hreflang="es" href="" />
          <a hreflang="de" href="" />
          <a hreflang="en" href="" />
      • Alternate link elements in the head section of HTML

          <link rel="alternate" hreflang="es" href="" />
          <link rel="alternate" hreflang="de" href="" />
          <link rel="alternate" hreflang="en" href="" />
  • Redirects from default language subfolder to site homepage (/en -> /)

  • Breadcrumbs for pages and posts

          <!-- url: /jekyll-skeleton/en/example-post -->
          <ol class="breadcrumb">
      		<li class="breadcrumb-item"><a href="/jekyll-skeleton/"><i class="fa fa-home" aria-hidden="true"></i></a></li>
      		<li class="breadcrumb-item ">
      		<a href="/jekyll-skeleton/en">en</a> 
      		<li class="breadcrumb-item active">
      		Example Post

Design Philosophy

jekyll-skeleton has been built with the following principles in mind:

  • Uses Yarn to manage libraries, assets, and utilities.
    • Bootstrap 4.
    • Font Awesome.
  • Gem theme independent.
  • Optimized for multilanguage.
  • Follows jekyll-seo-tag usage suggestions.



git clone
cd jekyll-seleton
make install


make serve


Adding a new language

Add the language to _config.yml:

	  path: ""
	  lang: "en"
	  layout: default
	  path: "es"
	  lang: "es"

Its name to _data/locales.yml and an equivalent to each page in the language in /_data/map.yml:

  en: index.html
  es: es/index.html
  en: about.html
  es: es/acerca.html

Adding posts

Add a post in each language located in the language subdirectory: /en, es, etc.

The following properties in posts front-matter are used:

title:       # jekyll-seo-tag - The title of the post, page, or document
description: # jekyll-seo-tag - A short description of the page's content
image:       # jekyll-seo-tag - URL to an image associated with the post, page, or document (e.g., /assets/page-pic.jpg)
author:      # jekyll-seo-tag - Page-, post-, or document-specific author information (see below)
lang:        # jekyll-seo-tag - Page-, post-, or document-specific language information


Jekyll-skeleton uses the following plugins:

If you want to host a site derived from this repo in Github, you can follow this guide: Automated Deployment Of Jekyll Websites To Github Pages With A Git Push To Github .

Final structure

$ make build
rm -fr _site/
rm -fr assets/vendor/ #from yarn
rm -fr assets/fonts #fontawesome dependency
rm -fr .sass_cache
bundle install --path vendor/bundler
Warning: the running version of Bundler (1.13.6) is older than the version that created the lockfile (1.15.0). We suggest you upgrade to the latest version of Bundler by running `gem install bundler`.
Using concurrent-ruby 1.0.5
Using i18n 0.8.1
Using minitest 5.10.2
Using thread_safe 0.3.6
Using public_suffix 2.0.5
Using colorator 1.1.0
Using colored 1.2
Using ffi 1.9.18
Using forwardable-extended 2.6.0
Using mercenary 0.3.6
Using mini_portile2 2.1.0
Using parallel 1.11.2
Using yell 2.0.7
Using sass 3.4.24
Using rb-fsevent 0.9.8
Using kramdown 1.13.2
Using liquid 3.0.6
Using rouge 1.11.1
Using safe_yaml 1.0.4
Using bundler 1.13.6
Using tzinfo 1.2.3
Using addressable 2.5.1
Using ethon 0.10.1
Using rb-inotify 0.9.8
Using pathutil 0.14.0
Using nokogiri 1.7.2
Using jekyll-sass-converter 1.5.0
Using activesupport 5.1.1
Using typhoeus 0.8.0
Using listen 3.0.8
Using jekyll-toc 0.2.1
Using html-proofer 3.7.2
Using jekyll-watch 1.5.0
Using jekyll 3.4.3
Using jekyll-feed 0.9.2
Using jekyll-redirect-from 0.12.1
Using jekyll-seo-tag 2.2.3
Using jekyll-sitemap 1.1.1
Bundle complete! 7 Gemfile dependencies, 38 gems now installed.
Bundled gems are installed into ./vendor/bundler.
yarn install
yarn install v0.24.5
[1/4] Resolving packages...
success Already up-to-date.
Done in 0.38s.
mkdir -p assets/vendor/
cp node_modules/font-awesome/css/font-awesome.min.css assets/vendor/
cp -r node_modules/font-awesome/fonts assets
cp node_modules/jquery/dist/jquery.min.js assets/vendor/
cp node_modules/tether/dist/js/tether.min.js assets/vendor/
cp node_modules/bootstrap/dist/js/bootstrap.min.js assets/vendor/
bundle exec jekyll build
Configuration file: /tmp/jekyll-skeleton/_config.yml
            Source: /tmp/jekyll-skeleton
       Destination: /tmp/jekyll-skeleton/_site
 Incremental build: disabled. Enable with --incremental
                    done in 5.474 seconds.
 Auto-regeneration: disabled. Use --watch to enable.

$ tree -L 3 _site/
├── assets
│   ├── fonts
│   │   ├── FontAwesome.otf
│   │   ├── fontawesome-webfont.eot
│   │   ├── fontawesome-webfont.svg
│   │   ├── fontawesome-webfont.ttf
│   │   ├── fontawesome-webfont.woff
│   │   └── fontawesome-webfont.woff2
│   ├── main.css
│   └── vendor
│       ├── bootstrap.min.js
│       ├── font-awesome.min.css
│       ├── jquery.min.js
│       └── tether.min.js
├── de
│   ├── beispiel-post.html
│   ├── index.html
│   └── unterkategorie1
│       ├── index.html
│       └── post-in-unterkategorie.html
├── deploy_key.enc
├── en
│   ├── example-post.html
│   ├── index.html
│   └── subcategory1
│       ├── index.html
│       └── post-in-subdirectory.html
├── es
│   ├── index.html
│   ├── post-ejemplo.html
│   └── subcategoria1
│       ├── index.html
│       └── post-en-subdirectorio.html
├── feed.xml
├── index.html
├── package.json
├── robots.txt
├── sitemap.xml
└── yarn.lock

9 directories, 32 files

$ make check
bundle exec jekyll doctor
Configuration file: /tmp/jekyll-skeleton/_config.yml
  Your test results are in. Everything looks fine.
bundle exec htmlproofer --check-html \
	--http-status-ignore 999 \
	--internal-domains,localhost:4000 \
	--assume-extension \
Running ["ScriptCheck", "LinkCheck", "HtmlCheck", "ImageCheck"] on ["_site"] on *.html... 

Checking 14 external links...
Ran on 13 files!

HTML-Proofer finished successfully.


Feel free to open issues and/or contributing!


English homepage


Spanish homepage


German post


Open Source Agenda is not affiliated with "Jekyll Skeleton" Project. README Source: marcanuy/jekyll-skeleton

Open Source Agenda Badge

Open Source Agenda Rating