Skip to content

Instantly share code, notes, and snippets.

@drewm
Last active April 30, 2021 06:24
Show Gist options
  • Save drewm/993d2237e24a928151b953fa3964ce9c to your computer and use it in GitHub Desktop.
Save drewm/993d2237e24a928151b953fa3964ce9c to your computer and use it in GitHub Desktop.
Dynamic Social Sharing Images
const puppeteer = require('puppeteer');
const imagemin = require('imagemin');
const imageminPngquant = require('imagemin-pngquant');
// Get the URL and the slug segment from it
const url = process.argv[2];
const segments = url.split('/');
const slug = segments[segments.length-2];
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto(url + 'sharing');
await page.setViewport({
width: 600,
height: 315,
deviceScaleFactor: 2
});
await page.screenshot({path: slug + '.png'});
await browser.close();
await imagemin([slug + '.png'], 'build', {
plugins: [
imageminPngquant({quality: '75-90'})
]
});
})();
@niladam
Copy link

niladam commented Jan 4, 2019

Thank you for sharing this. I was looking on building something similar and i might be able to automate this somehow.

I'll get back to you if I do.

Justa sidenote for people reaching this without having read the article, the article's link is https://24ways.org/2018/dynamic-social-sharing-images/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment