After quietly launching v1.0.0 yesterday (Saturday, Sep. 19, 2020) I was reorganizing my TODO list on this project and saw the “Someday: Drafts” item.
Only intending to do a bit of searching for those who may have already tackled “drafts” in 11ty, I quickly realized I could leverage 11ty’s Collections and environment variables in a simple conditional using custom filtering in the .eleventy.js config file.
NOTE: I’m still interested in refactoring this conditional into a more elegant, less repetitive solution. I’ve found the optional chaining (?.) operator and it seems exactly what I want to do… But I haven’t yet figured out how to implement it within the return
part of the .addCollection
function.
If you’re reading this and you know how, please ping me on Twitter.
/** .eleventy.js
*
* Collections
* ============================
*
* POST Collection set so we can check status of "draft:" frontmatter.
* If set "true" then post will NOT be processed in PRODUCTION env.
* If "false" or NULL it will be published in PRODUCTION.
* Every Post will ALWAYS be published in DEVELOPMENT so you can preview locally.
*/
eleventyConfig.addCollection('post', (collection) => {
if (process.env.ELEVENTY_ENV !== 'production')
return [...collection.getFilteredByGlob('./src/posts/*.md')]
else
return [...collection.getFilteredByGlob('./src/posts/*.md')]
.filter((post) => !post.data.draft)
})
Then just add a draft: true/false
key/value to the Post Frontmatter:
- If
draft: true
the Post will not be processed by 11ty in aproduction
environment. - The Post will ALWAYS be processed by 11ty if:
draft: false
draft:
- Or if
draft:
frontmatter is completely omitted…as in already published Posts.
Once again… Something I thought was going to be difficult and/or frustrating to figure out was a breeze in 11ty!