Welcome to Twig Template Site
For years, we built sites using Dreamweaver's templating language, called Tridion. This archaic language was so old, no modern developer remembered it existed and documentation was largely non-existent. Remember Macromedia?
Updating sites using Tridion was slower than a Sunday afternoon, especially as sites grew in size. Since every single page contained all the template code, Dreamweaver had to update every individual page every time the smallest change was made.
Error often plagued those sluggish updates. In fact, a simple template error once caused Dreamweaver to slash off the bottom half of every page on the CABA site during a simple update. And other updates all too often either got stuck or crashed Dreamweaver.
Plus, every update required a developer. Ughhh!
For years, I've attempted to change that, experimenting with both Pure PHP, Shopify, Craft CMS, Grav, and others. Each had their own set of issues. Pure PHP was too technical and messy, Shopify focused too much on eCommerce, Craft required a steep learning curve, and Grav was too new.
However, the simplicity and power of Twig (Craft's templating language) quickly captured my attention. Once I began developing sites on Twig, though, I realized every site required over a dozen setup steps. This repo aims to change that.
Technologies baked in:
Twig 3
This project uses the Twig templating language, which is awesome. I've found it to be one of the simplest ways to get a dynamic site up and running.
Twig 3 Intl Extra Extension
Adds useful functionality to Twig such as date and currency formatting.
Custom Twig Extensions slugify shuffle lorem
Allows Twig to convert strings of text into url compatible slugs, shuffle text, and generate lorem ipsum text.
Crema Captcha 4.3.9
Prevents spam without turning your site into a Google spy or forcing your clients to identify images of a dog in a wet Mississippi rain.
Gulp Compiler
A plug-and-play config, which allows us to import our custom framework via gulp and npm.
Starter Theme
Dead simple starter template for using a pretty common / standard website layout and examples of how to load both global and page specific data.
Bootstrap v5
A stock version of Bootstrap v5, which no longer requires jQuery!
iMask
Data masking using Pure JS. Don't remember why, but I liked it better than Vanilla Masker.
Glide JS Slider
Slideshow component using Pure JS. It's a lot more powerful than Bootstrap's slider with features such as responsive breakpoints, swiping, keyboard navigation, multiple visible slides, etc. It's NOT as powerful as Slick Slider though.
Best Practices
This repo is chock full of best practices I've found for organizing / coding a Twig site. For example:
- The core folder structure is almost entirely flat, so you don't have to click through layers of subfolders.
- The assets folder is set up exactly like our other sites
- Use of custom html classes is non-existent and excessive class chaining is very minimal. We're extending Bootstrap classes using SCSS wherever possible.
