Templates. Jekyll uses the Liquid templating language to process templates. All of the standard Liquid tags and filters are supported. To make common tasks easier, Jekyll even adds a few handy filters and tags of its own, all of which you can find on this page. Jekyll even lets you come up with your own tags via plugins. Filters Options for the slugify filter The slugify filter accepts an option, each specifying what to filter. None: no characters raw: spaces default: spaces and non-alphanumeric characters pretty: spaces and non-alphanumeric characters except for ._~! Includes If you have small page snippets that you want to include in multiple places on your site, save the snippets as include files and insert them where required, by using the include tag: {% include footer.html %} Jekyll expects all include files to be placed in an _includes directory at the root of your source directory. For more advanced information on using includes, see Includes. Code snippet highlighting Line numbers Linking to posts.
CSS Variables with Jekyll and Liquid « null program. CSS variables have been proposed a numberof times already, but, as far as I know, it has never been taken seriously. Variables -- constants, really, depending on the proposal -- would be useful in eliminating redundancy, because the same value often appears multiple times across a consistent theme. The cascading part of cascading stylesheets can deal with some of this, but not all. For example, Because the color has been defined in one place, adjusting the color theme requires only one change.
That's a big help to maintenance. I recently investigated CSS variables, not so much to reduce maintenance issues, but mainly because I wanted to have user-selectable color themes. If you look in my site's source repository (not the build code hosted here), you'll see my core stylesheet is an _include and looks like this, Those are Liquid variables. ---backA: "#ecffdc"backB: WhitebackC: WhiteSmokeforeA: BlackforeB: SlateGrayborder: Silverlinks: Blue--- Shopify Cheat Sheet - Liquid variables. Jekyll Themes • Made Mistakes. As I continue to hack away at the design of Made Mistakes and improve on things, I’ve tried to release a simplified Jekyll starter after each major revision. Just my way of giving back to the community. Below are all of the Jekyll starters I’ve open sourced thus far. Each “theme” contains all the _layouts, _includes, assets, and sample posts/pages to get you started. For the most part they share a lot of similarities (especially in _config.yml), which should make switching and updating easier.
A responsive Jekyll blog theme designed to give your site a modern and somewhat cliche feel. Modern, subtle design Animated main menu So Simple A simple and clean responsive Jekyll theme for words and large photographs. Minimal design Search script Minimal Mistakes A minimally designed responsive Jekyll theme for text heavy blogs. Minimal design Author sidebar Automatic table of contents on single posts via Kramdown License Found This Useful or Enjoyable? Going Static without a CMS using Jekyll • Made Mistakes. If you follow the trends in modern web design and development, it’s hard to ignore the work being done around responsive design. Seems like every other week there is an awesome article about media queries, fluid grids, mobile first, or responsive images on websites like A List Apart and Smashing Magazine.
Which got me thinking “Shit. I don’t know anything about these new technologies or techniques, I better learn fast.” And the only real way I was going to pickup all this was to create a project for myself. So began the process of evaluating how to build my personal website and how I’d like it to function. Why Go Static For the last ten years I’ve used a CMS to hold and present personal blogs and portfolios of my design work. A common problem facing Wordpress sites are their speed, due to a number of reasons. Designers Are Control Freaks But the real reason that prompted me to look at going back to my web roots was control. The Journey to a Static Website Generating the Site with Jekyll.