11ty Blog Starter

Overview:

This product is a blog starter template that can be hosted on platforms like Netlify, Surge, Firebase hosting, etc. It is designed to be a static site generated using Eleventy and styled with Tailwind CSS v2.0. The blog has a dark mode option and aims to still run without JavaScript. It has features like custom excerpts, a filter for read time, a 404 page, tags page, sitemap and robots.txt, image handling using shortcodes, draft posts functionality, ESLint integration, and a bash script to create new posts. The blog can be run locally on localhost:8080 after setting it up.

Features:

• Static Site Gen - Eleventy: The blog is generated as a static site using Eleventy.
• Tailwind CSS v2.0 / Tailwind Typography / Dark Mode: The blog is styled using Tailwind CSS v2.0 and includes a dark mode option.
• Custom Excerpts: Excerpts for blog posts can be created using the <!-- excerpt --> tag.
• Custom ReadTime Filter: A filter is available to calculate and display the estimated read time for each blog post.
• 404 Page: The blog has a custom 404 page.
• Tags Page: There is a separate page to view posts related to specific tags. All available tags are listed as buttons on the tags page.
• Sitemap and Robots.txt: The blog includes a sitemap and robots.txt file for search engine optimization.
• Image Handling: An image handling shortcode is available to add images to blog posts. Images can be stored in src/assets/img/posts and added using the asset_img shortcode.
• Draft Posts: The blog supports the creation of draft posts using the published front matter.
• Posts Pagination: The index.html page includes pagination for blog posts.
• Change Size Front Matter Variable: The size front matter variable can be changed for individual blog posts.
• ESLint: ESLint is integrated into the blog for code linting.
• Bash Script to Create New Post: A bash script is provided to easily create new blog posts.
• Running Locally: The blog can be run locally on localhost:8080.
• Deployment Options: The blog can be deployed on platforms like Netlify, Surge, Firebase hosting, etc. The build command is npm run build and the output folder is _site.

Installation:

To install and set up the blog starter template, follow these steps:

1. Clone the repository to your local machine:

   git clone [repository-url]
   

2. Navigate to the cloned directory:

   cd [directory]
   

3. Install the required dependencies:

   npm install
   

4. Customize the settings in the _data folder and other relevant files to match your blog’s requirements.

5. Run the build command:

   npm run build
   

6. The generated site files will be available in the _site folder. You can deploy these files on your preferred hosting provider.

7. To run the blog locally, start the server:

   npx eleventy --serve
   

   You can then access the blog at localhost:8080 in your browser.

Summary:

This blog starter template is a static site generated using Eleventy and styled with Tailwind CSS v2.0. It offers features such as dark mode, custom excerpts, read time calculation, tags page, sitemap, robots.txt, image handling, draft posts, pagination, ESLint integration, and a bash script for creating new posts. It can be hosted on platforms like Netlify, Surge, Firebase hosting, etc. Installation and customization instructions are provided to set up the blog according to your requirements.