A tribute to kaktus theme built with 11ty static site generator.
git clone https://github.com/Defite/kaktus-11ty.git my-blog-name
cd my-blog-name
Specifically have a look at .eleventy.js
to see if you want to configure any Eleventy options differently.
npm install
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
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.
Go to .eleventy.js
, find Cloudinary section and uncomment two strings:
eleventyConfig.cloudinaryCloudName = "demo";
eleventyConfig.hostname = "demo";
Replace with your Cloudinary values.
To use images in posts, use shortcode:
{% respimg
src="/img/sample.jpeg",
width="520",
sizes="500, 1000",
alt="Simple Pic",
loading="lazy"
%}
All metadata is stored in _data/metadata.json
. You can set everything there.