Introduction

Eleventy Simple is a lightweight blog starter template that combines the power of 11ty (Eleventy) static site generator with the simplicity of Simple.css. This project provides an excellent foundation for creating fast, minimalist blogs or websites. It's based on the eleventy-base-blog and optimized for ease of use and quick setup.

Main Features

1. Built with 11ty (Eleventy) static site generator
2. Utilizes Simple.css for clean, minimalist styling
3. Responsive design out of the box
4. Blog post support with tags and archives
5. RSS feed generation
6. Sitemap generation
7. Easily customizable layouts and templates
8. Markdown support for content creation
9. Automatic navigation generation
10. Optimized for fast loading and performance

Installation Steps

1. Clone the repository:

   git clone https://github.com/lkhrs/eleventy-simple.git my-blog-name
   

2. Navigate to the project directory:

   cd my-blog-name
   

3. Install dependencies:

   npm install
   

4. Edit the _data/metadata.json file to update your site's information.

5. Run Eleventy to build your site:

   npx @11ty/eleventy
   

6. For local development with live reloading, use:

   npx @11ty/eleventy --serve
   

Usage Instructions

1. Content Creation:

   • Add new blog posts in the posts/ directory using Markdown format
   • Create content pages like "About" by following the example in about/index.md

2. Customization:

   • Modify layouts in the _includes/layouts/ directory
   • Adjust styles by editing files in the css/ directory
   • Configure site settings in _data/metadata.json

3. Navigation:

   • Use the eleventyNavigation key in front matter to add pages to the top-level navigation

4. Templates:

   • Eleventy supports various template formats, configurable in .eleventy.js

5. Static Assets:

   • Place images in the img/ directory
   • CSS files should go in the css/ directory

6. Blog Features:

   • Use tags in post front matter for categorization
   • The archive page and tag pages are automatically generated

7. Deployment:

   • After building, deploy the contents of the _site directory to your web host

Important Notes

1. The project uses three main layouts: base, home, and post. Customize these in the _includes/layouts/ directory.

2. The postlist.njk file is a reusable component for displaying lists of posts.

3. RSS feed template is located in feed/feed.njk.

4. Sitemap generation is handled by sitemap.xml.njk.

5. The project includes a .nvmrc file for specifying the Node.js version.

6. A todo.md file is included for tracking project tasks and improvements.

7. The template is set up with a netlify.toml file for easy deployment to Netlify.

8. A .editorconfig file is included to maintain consistent coding styles.

9. The project uses Renovate for dependency management, configured in renovate.json.

10. For any advanced configurations or optimizations, refer to the Eleventy and Simple.css documentation.