Skip to main content

Introduction

Get started with Boost.

To set up the theme, you need:

  • A command line interface

    You can use the default command line on Mac and Windows (Terminal) or use a code editor with a built-in command line like Visual Studio Code.

  • Node

    To install Node, go to Node.js, download it and follow the steps (LTS is the recommended version).

Files structure

Once you unzip the folder, you'll see the following file structure:

  • dist - Production files
  • src
    • assets - Scss and images
    • pages - All pages
    • templates - Nunjucks templates
  • .eleventy.js - Eleventy configuration file
  • package.json - npm dependencies and scripts
  • purgecss.config.js - PurgeCSS configuration file

The dist folder contains the files you would upload to your web server to publish the site.

Development

Open your terminal, make sure you are in the same directory of the unzipped theme, and run the following command to install all dependencies:

npm i

In the terminal, run the following command:

npm start

It compiles the source files, generates the site, and starts a local server.

Now go to http://localhost:8080 in your browser to see the site.

Eleventy + Nunjucks

This theme uses Eleventy as a static site generator and Nunjucks as a templating engine.

Front matter

You can add metadata in your template front matter:

---
layout: base
title: Home
description: Boost is a clean and accessible theme for Bootstrap.
permalink: /
---
  • Layout: the template used to wrap the content.
  • Title: page title.
  • Description: meta description.
  • Permalink: allows remapping your template's URI.

Optimization

Once your site is ready to publish, run the following command:

npm run optim

It generates the site from scratch, format the HTML, removes unused CSS, and compress the size of the images.