Eleventy Template Bliss

screenshot of Eleventy Template Bliss
eleventy
scss

Single-column blog template for Eleventy focused on simplicity without sacrificing functionality

Overview

Bliss is a single-column blog template designed for use with the Eleventy static site generator. It emphasizes simplicity without sacrificing functionality. This theme, which is a modified and improved version of a theme used on the Offbeat Bits blog, offers a range of features including light/dark mode switching, sharing buttons for social media platforms, Mastodon integration, translation support, code syntax highlighting, and accessibility features. It also provides options for personalization and customization.

Features

  • Light / Dark Mode Switcher: Allows users to switch between light and dark modes, and also honors the browser color scheme preferences.
  • Sharing Buttons: Provides sharing buttons for popular social media platforms, including Mastodon, as well as the option to copy the post URL to the clipboard.
  • Mastodon Integration: Generates a .well-known/webfinger file and automatically generates <link rel="me"> tags for site ownership verification on Mastodon.
  • Translation Ready: Supports custom language tags and includes a separate file with static phrases for easy translation.
  • Automatic Favicon Generation: Generates the favicon automatically during the build process.
  • PWA Support: Includes a manifest file for Progressive Web App support.
  • Code Syntax Highlighting: Uses PrismJS and the Eleventy syntax highlighting plugin for code syntax highlighting in HTML, JS, JSON, and CSS.
  • RSS Feeds and JSON-LD Data: Provides RSS and JSON feeds, as well as JSON-LD data for enhanced search engine optimization.
  • Accessibility Features: Includes accessibility features to ensure a more inclusive user experience.
  • HSL Color Palette and CSS Variables: Offers a straightforward way to personalize the theme with a HSL color palette and CSS variables.
  • Modular CSS and SASS: Uses modular CSS augmented with SASS for ease of customization.
  • Custom Disclaimers: Allows for the inclusion of custom disclaimers alongside post content.

Summary

Bliss is a well-designed and versatile blog theme for the Eleventy static site generator. It offers a range of useful features, including light/dark mode switching, social media sharing buttons, Mastodon integration, translation support, and code syntax highlighting. The theme also provides options for personalization and customization, allowing users to easily modify the color palette, include custom disclaimers, and add their own posts and pages. With its accessibility features and support for various feed formats and JSON-LD data, Bliss is a great choice for bloggers looking for a stylish and functional theme for their Eleventy-powered blogs.

eleventy
Eleventy

11ty is a static site generator that allows developers to build fast, modern websites using HTML, Markdown, and other templating languages, without the need for a complex build system.

scss
SCSS

SCSS is a preprocessor scripting language that extends the capabilities of CSS by adding features such as variables, nesting, and mixins. It allows developers to write more efficient and maintainable CSS code, and helps to streamline the development process by reducing repetition and increasing reusability.

blog
Blog

Blog websites feature posts written by one or more authors, organized by categories and tags, with a section for comments and archives sorted by date or topic. Additional features may include search bar, social media sharing, subscription or RSS feed, about and contact pages, and visual content.

template
Templates & Themes

A template or theme refers to a pre-designed layout or structure that provides a basic framework for building a specific type of application or website. It typically includes good design, placeholder content and functional features, allowing developers to customize and fill in the details according to their specific needs.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.