Dates in Eleventy

Ed H AHSAA Blog
Ed's Blog Index & Contents

Oct 14, 2021 7:00

Page.date with Eleventy

I want to automatically show the last update or last modified date in the footer of every page.

Step 1)

An easy way to do this. In base.njk file I add the following date: Last Modified into the front matter. Remember that front matter is whatever is between the upper --- and the lower ---

Date: in Front Matter

If date: is left out of the front matter then page.date will default to the date the file was created. Alternatively if date: Last Modified is in the front matter then page.date uses the last modified date of the file. Very nice clean and easy.

Read more about dates Setting a Content Date in Front Matter:

Step 2)

In the _footer include file I put the following

How to use page.date

The first line has a bulma Text Color class and a Bulma Typography size helper the second line uses page.date which is set to Last Modified (see above) and in this example shows one way to format the date.

In order to use this fancier date filter, I installed this date filter from the dayjs filters which I installed September 2021 I learned about dayjs and how to install dayjs from Eszter.

One small issue. I also use a custom specified page.date to sort my blog files with a fixed date. So there is a slight conflict. Hmmm.... now what? I will have to think about this a bit and get back to you. To be continued.