Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Use the HTML5 <time> element while nicely formatting your blog post's date
// in .eleventy.js, add the two functions inside your `module.exports = function (eleventyConfig) {}` block:
```
eleventyConfig.addFilter("toISOString", (date) => (
new Date(`${date} 00:00:00`).toISOString()
));
eleventyConfig.addFilter("formatDateForBlog", (date) => (
new Date(`${date} 00:00:00`).toLocaleString('en-us', { month: 'long', day: 'numeric', year: 'numeric' })
));
```
// in your layout/template file, call them like this:
```
<time datetime="{{ date | toISOString }}">{{ date | formatDateForBlog }}</time>
```
// the rendered HTML will look like this:
```
<time datetime="2020-03-27T07:00:00.000Z">March 27, 2020</time>
```
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.