Skip to content
This repository has been archived by the owner on Jun 22, 2024. It is now read-only.
/ 11ta-template Public archive

Deeply customizable, full-featured, ready to publish blog template built with 11ty, TailwindCSS, & Alpine.js

License

Notifications You must be signed in to change notification settings

11ta/11ta-template

Repository files navigation

11TA - 11ty, TailwindCSS, & Alpine.js Template

Update v2.1, 221018 - It's working again! Greatly simplified. Updated all pkgs and removed those no longer necessary. All original functionality remains. I'll be using this template for several personal sites and so will try to keep it updated with any changes and added functionality I create for those sites.


UPDATE v2.0.0 - Breaking Changes In order to provide scalability and cleaner frontmatter controls in current Posts (and upcoming Products) collections, the Frontmatter keys were updated which required updates to /src/_includes/components/*.njk, tailwind.config.js, and other templates. I apologize for the inconvenience.


I set out to build a starter project template for 11ty that has TailwindCSS and Alpine.js baked in.

Version 1.0.0 morphed into a deeply customizable, full featured, text-based CMS for managing small websites with easy-to-manage configuration files in the /src/_data/ directory.

Netlify Status

Lighthouse Performance Lighthouse Accessibility Lighthouse Best Practices Lighthouse SEO


Live Demo

The live demo at "11ta.netlify.app" provides a feature list, and the evolving blog posts each highlight and provide examples of different features, shortcodes, customizations, and frontmatter controls.

🔥 Credit 🔥

First and foremost, I want to credit the 11ty community, especially those listed in the starter projects!

Specifically, the following starter projects helped me understand the power and flexibility of 11ty and from their examples I was able to extend the functionality to build this system:

Deploy and Host at Netlify Automatically

To automatically deploy this Template to Netlify for free hosting, make sure you're logged in to your Netlify account and then simply click the Deploy to netlify button below.

Deploy to Netlify

Install and Deploy Manually

  • Duplicate this repository by clicking Use this template above
  • Clone the repository locally
  • Run npm install to install dependencies
  • npm run dev to work locally

Planned

  • "Themed" versions for Portfolios/Creatives, Agencies, Digital Gardens, etc.
  • Easy add Collections: Projects, Services, Jobs, etc.
  • Snipcart integration