70530889e4
# Conflicts: # .eleventy.js # package.json # tags-list.njk |
||
---|---|---|
_data | ||
_includes | ||
.github | ||
about | ||
css | ||
feed | ||
img | ||
posts | ||
.editorconfig | ||
.eleventy.js | ||
.eleventyignore | ||
.gitignore | ||
.nojekyll | ||
.nvmrc | ||
404.md | ||
archive.njk | ||
index.njk | ||
LICENSE | ||
netlify.toml | ||
package.json | ||
page-list.njk | ||
README.md | ||
sitemap.xml.njk | ||
tags-list.njk | ||
tags.njk |
eleventy-base-blog
A starter repository showing how to build a blog with the Eleventy static site generator.
Demos
Deploy this to your own site
Deploy this Eleventy site in just a few clicks on these services:
Or, read more about Deploying an Eleventy project.
Getting Started
1. Clone this Repository
git clone https://github.com/11ty/eleventy-base-blog.git my-blog-name
2. Navigate to the directory
cd my-blog-name
Specifically have a look at .eleventy.js
to see if you want to configure any Eleventy options differently.
3. Install dependencies
npm install
4. Edit _data/metadata.json
5. Run Eleventy
npx @11ty/eleventy
Or build and host locally for local development
npx @11ty/eleventy --serve
Or build automatically when a template changes:
npx @11ty/eleventy --watch
Or in debug mode:
DEBUG=* npx @11ty/eleventy
Implementation Notes
about/index.md
shows how to add a content page.posts/
has the blog posts but really they can live in any directory. They need only thepost
tag to be added to this collection.- Use the
eleventyNavigation
key in your front matter to add a template to the top level site navigation. For example, this is in use onindex.njk
andabout/index.md
. - Content can be any template format (blog posts needn’t be markdown, for example). Configure your supported templates in
.eleventy.js
->templateFormats
. - The
css
andimg
directories in the input directory will be copied to the output folder (viaaddPassthroughCopy()
in the.eleventy.js
file). - The blog post feed template is in
feed/feed.njk
. This is also a good example of using a global data files in that it uses_data/metadata.json
. - This example uses three layouts:
_includes/layouts/base.njk
: the top level HTML structure_includes/layouts/home.njk
: the home page template (wrapped intobase.njk
)_includes/layouts/post.njk
: the blog post template (wrapped intobase.njk
)
_includes/postlist.njk
is a Nunjucks include and is a reusable component used to display a list of all the posts.index.njk
has an example of how to use it.