Home
Folder structure
- templates in /content
- documentation in /content/doc with aside navigation
- blog in /content/blog with pagination navigation
- layouts in /_layouts
- includes in /_includes with /components
- JSON files in /_data
- CSS files in /assets/css
- images & JS in /assets with /admin (Decap CMS)
Page layout
- _layouts/base.liquid: head code + DecapCMS scripts
- _layouts/default.liquid: HTML5 structure with ARIA landmarks
- _includes/nav-primary.liquid with primary navigation
- _includes/nav-secondary.liquid with secondary navigation
- _includes/nav-footer.liquid with footer navigation
- _includes/copyright.liquid to include in footer
Navigation links
- tags: add primary, secondary or footer in frontmatter
- for secondary tags, add folder with folder's name in frontmatter
Package.json scripts
- "serve": "npx @11ty/eleventy --serve",
- "start": "npx decap-server & npx @11ty/eleventy --serve",
- "build": "@11ty/eleventy",
- "build-gp": "eleventy --pathprefix '13-simple-blog'"
Dependencies
- "@11ty/eleventy": "^2.0.1"
- ready for Decap CMS integration.
- ready for GitHub Pages (.github/workflows/)
eleventy.config.js
module.exports = function (eleventyConfig) {
eleventyConfig.addWatchTarget("./assets");
eleventyConfig.addPassthroughCopy("./assets");
return {
dir: {
input: "content", // Set the source for 11ty
layouts: "../_layouts", // Base page layouts
includes: "../_includes", // All UI partials
data: "../_data", // JSON datasets
output: "_site" // This is the default
}
};
};