Home
Docs
Changelog
About
Black White Blue
Documentation

Black White Blue is a simple and minimal project page theme for Jekyll, which is designed to build project pages in an easier way.

Black, white and blue are the main colors used in the page. White for background, black for text and blue for links.

Installation

Add to your Jekyll site’s Gemfile:

gem "black-white-blue"

And add this line to your _config.yml:

theme: black-white-blue

Then execute:

$ bundle install

Usage

Project Metadata

Project metadata are defined in _config.yml as follows:

project:
  name: "Black White Blue"
  subtitle: "A simple and minimal project page theme for Jekyll."
  description: |-
    Black White Blue is a simple project page theme for Jekyll, which is designed to build project pages in a easier way.
    Black, white and blue are the colors used in the page. White for background, black for text and blue for links.
  repo: "crispgm/black-white-blue"
  logo: "/black-white-blue/assets/logo.png"
  author: "David Zhang"
  author_link: "https://crispgm.com/"
  email: crispgm@gmail.com
  twitter: crispgm
  medium: "@crispgm"

Project’s name/subtitle/description/repo/author/author_link are required. And you may present with a well-designed logo.

Email/Twitter/Medium are optional, which will be shown as icons on the bottom right.

Changelog

It is very easy to enable changelog. Set layout: changelog in any HTML and it is enabled.

Changelog is maintained in _data/changelog.yml.

To “release” a new version, simply add a structured item in the YAML:

- version: "1.0.1"
  changes:
    - text: Performance improved
      hash: 3325193
- version: "1.0.1"
  changes:
    - text: Bugfix
      issue: 12
- version: "1.0.0"
  changes:
    - text: "Initial version"

Each version comes with multiple changes, and you may present a text with an GitHub issue ID or a commit hash. It will be generated into links to the GitHub issues or commits specified.

Testimonials

Testimonials module has been released since 1.0.5, which works like a changelog.

To show testimonials, first include testimonials module in any place you’d like to show it.

<!-- your html codes above -->

<div class="review" id="testimonial">
  <div class="review-header">
    Testimonials
  </div>
  <div class="review-body">
  
    <div class="review-item">
      <div class="review-comment">
        Yet another choice to make project home page simple.
      </div>
      <div class="review-author">
        
        <a href="https://crispgm.com/">David Zhang</a>
        
      </div>
      <div class="review-title">
        Creator of BWB
      </div>
    </div>
  
    <div class="review-item">
      <div class="review-comment">
        I live in Republic of AD, which is an imaginary story. Inside that story, I use BWB even as my home page lol.
      </div>
      <div class="review-author">
        
        Stacey Fan
        
      </div>
      <div class="review-title">
        Virtual Girl of AD
      </div>
    </div>
  
  </div>
</div>


<!-- your html codes below -->

Then add testimonials by editing review.yml:

- author: John Smith
  link: https://example.com/
  title: Creator of Your Awesome Project
  comment: It works!

Google Analytics

Edit _config.yml and set your track_id:

google_analytics: UA-XXXXXXXX-1

Disqus

Init Disqus with your short name in _config.yml:

disqus:
  shortname: your-short-name

Then, enable Disqus in pages by adding a frontmatter comments:

---
layout: page
title: Disqus Example
comments: true
---

Contributing