Skip to content

Instantly share code, notes, and snippets.

@opattison
opattison / gallery.html
Last active January 21, 2020 08:11
A Jekyll photo gallery sample, using a for loop in liquid and collections in YAML front matter. This is sort of pseudo-code, but is in a working state in this project: https://github.com/opattison/jeancflanagan 2013-08-13
@opattison
opattison / jekyll-category-nav.html
Last active December 20, 2015 21:39
A pattern for category-limited navigation using Liquid in Jekyll. The `if` statement only generates a nav link if the URL for the next/previous post exists *and* if the category for the next post is of the same type. This pattern assumes that one is using categories to describe types of post (e.g. writing, photos, videos and so on) to build mult…
<footer class="post-nav">
{% if page.next.url and page.next.categories contains 'writing' %}
<a class="more next" href="{{page.next.url}}" title="Later article: {{page.next.title}}">Next</a>
{% endif %}
{% if page.previous.url and page.previous.categories contains 'writing' %}
<a class="more previous" href="{{page.previous.url}}" title="Earlier article: {{page.previous.title}}">Previous</a>
{% endif %}
</footer>
@opattison
opattison / figure.rb
Last active March 6, 2021 15:28
HTML <figure> tag Liquid tag plugin for Jekyll. Create figure/img HTML elements with optional classes and captions. This is a YAML-dependent Liquid tag plugin for Jekyll for those who fear link rot. The required bits are alt attributes and <img> tags. A unique feature for this method is a markdownified <figcaption>. This tag allows for optional …
# Title: Figure/image tag plugin for Jekyll
# Author: Oliver Pattison | http://oliverpattison.org
# Description: Create figure/img HTML blocks with optional classes and captions. This is a YAML-dependent Liquid tag plugin for Jekyll for those who fear link rot.
#
# Download/source/issues: https://github.com/opattison/jekyll-figure-image-tag
# Documentation: https://github.com/opattison/jekyll-figure-image-tag/blob/master/README.md
#
# Note: designed specifically for implementations with YAML front matter-based images, captions and alt text.
# Create YAML collections in a post like this:
#
@opattison
opattison / aws-s3-policy-with-ip-limit.json
Last active December 21, 2015 06:09
AWS S3 bucket with IP limits, for basic development testing on S3.
{
"Version": "2008-10-17",
"Statement": [
{
"Sid": "AddPermissions",
"Effect": "Allow",
"Principal": {
"AWS": "*"
},
"Action": "s3:GetObject",
@opattison
opattison / Rakefile
Last active December 21, 2015 13:59
A simple "notes" Rakefile based on the Octopress default Rakefile. I created this for a notes project.
require 'stringex'
# rake command that generates a new post and opens in default text editor
desc "Generates a new note"
task :post, :title do |t, name|
if name.title
title = name.title
else
title = get_stdin("Enter a title: ")
end
@opattison
opattison / jekyll-css-yaml-colors.css
Created August 28, 2013 01:11
How to use YAML front matter variables in a CSS file to define colors using variables in Jekyll, using Liquid tags. This example uses HSL colors with hex fallback colors. The goal here is to create standardized CSS with a color palette that can easily be extended to a whole file and maintained easily with only a few variables. The same thing cou…
---
white:
hsl: 'hsla(138, 10%, 98%, 1)'
hex: '#f9fafa'
black:
hsl: 'hsla(138, 16%, 10%, 1)'
hex: '#151e18'
green:
hsl: 'hsla(138, 39%, 54%, 1)'
hex: '#5cb777'
@opattison
opattison / jekyll-css-yaml-includes.css
Last active December 21, 2015 21:19
How to include multiple CSS sources in a compiled single CSS file (for example, resets, base styles, project-specific styles) using Liquid includes in Jekyll.
---
# No YAML required. Blank front matter so that CSS files can be included via Liquid templating.
# Make sure that the breaks are included at the start of the file so that Jekyll knows to process the Liquid includes.
---
{% include reset.css %}
{% include base.css %}
{% include project.css %}
@opattison
opattison / Preferences.sublime-settings
Last active August 29, 2015 13:56
Sublime Text 3 user config
{
"color_scheme": "Packages/Tomorrow Color Schemes/Tomorrow.tmTheme",
"enable_tab_scrolling": false,
"font_face": "Nitti Basic",
"font_options":
[
"no_italic"
],
"font_size": 19,
"ignored_packages":
@opattison
opattison / yaml-plus-liquid-loop.md
Created February 21, 2014 21:28
A test for YAML front matter loading of image attributes.

image: 1: - url: image1.jpg - caption: 'caption 1' - alt: 'alt text 1' - coordinates: [0, 52] image: 2:

@opattison
opattison / Twilight-Terrain-(MapBox-demo).markdown
Last active August 29, 2015 13:56
A Pen by Oliver Pattison.

Twilight Terrain (MapBox demo)

2014-02-22

Some of my photos on top of a custom MapBox terrain layer. This is a test for a photo gallery.

A Pen by Oliver Pattison on CodePen.

License.