PhilipJonesplaceholderfeatureplaceholdersliderplaceholderthumb

v1.1.0 Brings Draft Posts

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 a production 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!

Share: