A simple, basic site template built using Eleventy and YACCK.
This is a work-in-progress template, but you can use it in it's current state and it'll work great. More features may be added to this (see the current issues for potential additions).
I will be using this for my own personal site which will have functionality that may or may not be backported to this template.
Requirements: Node.js and NPM
1. Generate a fork of this repo
git clone https://github.com/{YOUR NAME}/{YOUR FORK'S REPO NAME}
cd {YOUR FORK'S REPO NAME}
npm install
npm run build
or to live reload as you edit source files:
npm run serve
You can deploy your built site to any host that serves static websites, such as GitHub Pages, Netlify or Vercel. Be sure to indicate ./dist/ as the directory to serve from.
The source files are located in the ./src/ directory and the generated files are in the ./dist/ directory. This is the directory you want to publish to your deployed site.
Occasionally, the ./dist/ directory gets out of sync when building, usually with files that have since been deleted from source. Run npm run clean to remove the ./dist/ folder and its contents. It will error if there is no ./dist/ directory.
.
├── dist [built files]
├── js [config files for eleventy]
└── src [site source files]
├── assets [site assets (images/css/js)]
├── _data [site data and configs]
├── _includes [layouts, partial files]
├── posts [all blog post files]
└── tags [tag pages]
.
├── .eleventy.js [eleventy configuration options]
├── package.json [npm package config]
├── package-lock.json
├── README.md [you're looking at it]
└── src
├── _data
│ └── metadata.json [site metadata]
└── posts
└── example-post.md [example post]
By default, templates are written using the Nunjucks templating language. Blog post templates (in ./src/posts/) are written in Markdown.
View the Eleventy docs for more instructions on creating your content.
I've written a custom theme for this site using my classless CSS framework, YACCK. The default font stack is the system font stack, pulled in from YACCK. Feel free to override this in ./src/_includes/partials/_head.njk and in the CSS file.
If you don't want to use YACCK, remove the references in _head.njk and use whatever you'd like. The generated HTML structure follows HTML5 standard conventions and tries to keep it as simple as possible. There are some extra styles in ./src/assets/css/styles.css you may or may not want as well.
Change out the logo and other images in ./src/assets/ to your own.
Extended functionality following examples from pborenstein.com