Minimalistic responsive Jekyll Theme using Bootstrap 4 and navbar


I just wanted a lean Bootstrap 4 CDN based theme with navigation. For some reason I couldn't find it, so I made my own.


Add this line to your Jekyll site's Gemfile:

gem "jekyll-remote-theme"

And add this line to your Jekyll site's _config.yml:

remote-theme: granbom/jekyll-theme-bootstrap4-navbar-cdn

Later it will be included at, just haven't done it yet.

GitHub pages

You can use this theme if using GitHub pages.

Add this line to your _config.yml:

remote_theme: granbom/jekyll-theme-bootstrap4-navbar-cdn


Create your own _data/navigation.yml to override the default example navigation. The format looks like:

- title: Home
  url: /

- title: Contact
  url: /contact/

- title: About
  url: /about/
    - title: Company
      url: /about/company/
    - title: Jobs
      url: /about/jobs/

This will setup your site's navigation.


This theme include four layouts: default.html, home.html, page.html, post.html. Home, page and post inherits from default, so the only layout really is default.html. Page and post do add the title as a <h1> followed by a <hr>. Apart from that the layout is as simple as below:

<!DOCTYPE html>
<html lang="{{ page.lang | default: site.lang | default: "en" }}">
{% include head.html %}
    {% include nav.html %}

    <div class="container" aria-label="Content">
    {{ content }}

    {% include footer.html %}


  • site.lang
  • site.google_analytics
  • page.lang


  • head.html have the links to bootstrap 4 CDN css.
  • nav.html is the navigation.
  • footer.html have the links to Bootstrap 4 CDN js files needed.


  • Add dummy pages
  • Add screenshot.jpg
  • Add Disqus
  • Add favicon and icon manifests
  • EU Cookie Law
  • Twitter stuff
  • Github stuff


Bug reports and pull requests are welcome on GitHub at


The theme is available as open source under the terms of the MIT License.

jekyll logo

Want a Jekyll website built?

Hire a Jekyll developer