Rich Link Previews in Eleventy

Generating attractive link previews with the Eleventy static site generator, Nunjucks, and html-metadata

Initial setup

npm init -y
npm install --save @11ty/eleventy
npm install --save html-metadata

Setting up the link preview function

# Rich link previews in Eleventy
This is a demonstration of rich link previews in Eleventy
{{"" | linkPreview | safe}}

Scraping link metadata

Caching link metadata

Lazy loading preview images

Head of Product at RevenueCat; previously at 8fit, Yammer, BCG.