11ty Stencil Theme

Overview

The Blog Starter is a static site generator that allows you to create a blog that runs without javascript. It uses Eleventy as the static site generator and incorporates Tailwind CSS v2.0, Tailwind Typography, and a Dark Mode feature. It also includes features such as creating excerpts, a custom ReadTime filter, a 404 page, and a tags page to view posts related to a specific tag. The theme provides a Sitemap and Robots.txt file, allows you to easily add images using a shortcode, and supports draft posts. The Blog Starter can be deployed to Cloudflare Workers and includes social profile integration, readable dates, an RSS feed, and minification of CSS using PostCSS. It supports both dark and white themes with customizable colors.

Features

Static Site Gen — Eleventy

• Utilizes Eleventy as the static site generator.

Tailwind CSS v2.0 / Tailwind Typography / Dark Mode

• Includes the latest version of Tailwind CSS and Tailwind Typography.
• Supports a Dark Mode feature.

Create Excerpts

• Allows you to create excerpts using the <!-- excerpt --> tag.

Custom ReadTime Filter

• Provides a custom ReadTime filter.

404 Page

• Includes a custom 404 page.

Tags Page

• Allows you to view posts related to a specific tag using a tags page.
• Displays all available tags as buttons.

Sitemap and Robots.txt

• Automatically generates the Sitemap.xml and Robots.txt files.
• Change the site URL in the _data/site.json file.

Shortcode to Handle Images

• Supports adding images under src/assets/img/posts directory.
• Provides a shortcode to add images using the asset_img shortcode. For example: {% asset_img 'mailbox.jpg' 'mailbox' %}.

Draft Posts

• Enables the creation of draft posts using the published frontmatter.

Posts Pagination

• Allows pagination of posts on the index.html page.

Change Size Frontmatter Variable

• Provides the ability to change the size frontmatter variable.

ESLint

• Includes ESLint for code linting.

Bash Script to Create New Post

• Offers a bash script to create a new post based on the current year and month.

Running Locally

• Allows you to create your blog posts under src/posts directory.
• Access the blog locally by navigating to localhost:8080 after starting the server.

Deployment

• Supports deployment to Cloudflare Workers.

Social Profiles

• Includes integration with Line Awesome font.
• Provides minimalistic icons for social profiles.

Readable Dates

• Generates readable dates using momentjs.
• Transforms date from 2023-11-14 to November 14, 2023.
• Utilizes the dateIso and dateReadable filters within templates.

RSS Feed

• Generates an RSS Feed from the feed.liquid file.
• Supports the generation of Yandex turbo.
• The final feed is located at /feed/feed.xml.

Minify CSS with PostCSS

• Uses PostCSS to minify CSS.
• Provides options for input and output.

Sitemap.xml and Robots.txt

• Automatically generated from page's data and data from _data/site.json.
• Includes helpful files for SEO.
• Customizable colors for dark and white themes.

Summary

The Blog Starter is a feature-rich theme that allows you to create a static blog without the need for javascript. It utilizes Eleventy as the static site generator and includes various features such as a dark mode, tags page, and custom read time filter. The theme also provides easy image handling, draft post support, ESLint integration, and options for deployment. With customizable colors, social profile integration, and minification of CSS, the Blog Starter offers everything you need to create a professional and functional blog.