Date formatting in jekyll

Source

Introduction

Formatting dates can be tricky if you need a specific format. In this tutorial we’ll show you how to build a date in almost any format.

Setup

We’ll start by setting a date in front matter in ISO 8601 format.

---
layout: default
title: Date Formatting
datePublished: 2016-03-23T10:20:00Z
---

Now we can run the date through a filter to get the desired format.

datetolong_string

Input:

{{site.lcb}}{{site.lcb}} page.date | date_to_long_string }}

Output:

23 March 2016

datetorfc822

Input:

{{site.lcb}}{{site.lcb}} page.date | date_to_rfc822 }}

Output:

Wed, 23 Mar 2016 23:20:00 +1300

datetostring

Input:

{{site.lcb}}{{site.lcb}} page.date | date_to_string }}

Output:

23 Mar 2016

datetoxmlschema

Input:

{{site.lcb}}{{site.lcb}} page.date | date_to_xmlschema }}

Output:

2016-03-23T23:20:00+13:00

date

date gives us complete control of the format. We can specify a template of the format we want. For example.

Input:

{{site.lcb}}{{site.lcb}} page.date | datePublished: "%m/%d/%Y" }}

Output:

03/23/2016

or

Input:

{{site.lcb}}{{site.lcb}} page.date | datePublished: "%-d %B %Y"}}

Output:

23 March 2016

There’s many placeholders we can use for date formatting.

Placeholder Format Example
%a Abbreviated weekday Sun
%A Full weekday name Sunday
%b Abbreviated month name Jan
%B Full month name January
%c Preferred local date and time representation Fri Jan 29 11:16:09 2016
%d Day of the month, zero-padded 05
%-d Day of the month 5
%D Formats the date 29/01/16
%e Day of the month 3
%F Returns the date in ISO 8601 format 2016-01-29
%H Hour of the day, 24-hour clock 07
%I Hour of the day, 12-hour clock 04
%j Day of the year 017
%k Hour of the day, 24-hour clock 7
%m Month of the year 04
%M Minute of the hour 09
%p Meridian indicator uppercase AM
%P Meridian indicator lowercase pm
%r 12-hour time 01:31:43 PM
%R 24-hour time 18:09
%T 24-hour time with seconds 18:09:13
%s Number of seconds since 1970-01-01 00:00:00 UTC 1452355261
%S Second of the minute 05
%U Week number of the current year, starting with the first Sunday as the first day of the first week 03
%W Week number of the current year, starting with the first Monday as the first day of the first week 09
%w Day of the week. Sunday is 0 4
%x Preferred representation for the date 05/11/15
%X Preferred representation for the time 17:15:31
%y Year without a century 16
%Y Year with a century 2016
%Z Time zone name PST
%% Literal % character %

Ordinal One notable exclusion from this list getting the ordinal date. For example we couldn’t output “May 23rd” because there’s no placeholder for the “rd”.

A workaround for this is to use Liquid to calculate and output the ordinal.

{{site.lcb}} assign day = page.date | datePublished: "%-d"  %}
 {{site.lcb}} case day %}
   {{site.lcb}} when '1' or '21' or '31' %} {{site.lcb}}{{site.lcb}} day }}st
   {{site.lcb}} when '2' or '22' %} {{site.lcb}}{{site.lcb}} day }}nd
   {{site.lcb}} when '3' or '23' %} {{site.lcb}}{{site.lcb}} day }}rd
   {{site.lcb}} else %} {{site.lcb}}{{site.lcb}} day }}th
 {{site.lcb}} endcase %}
 {{site.lcb}}{{site.lcb}} page.date | datePublished: "of %B, %Y" }}

23rd of March, 2016