DEV Community

loading...

Discussion on: Automated Social Sharing Images with Puppeteer, 11ty, and Netlify

Collapse
geshan profile image
Geshan Manandhar

Great post, are there any screenshot examples for the blog posts?

Collapse
5t3ph profile image
Stephanie Eckles Author

Thanks! The ones I'm generating for the site mentioned are basically mini versions of the header that you see for posts. The wonderful part is that you can use CSS to achieve any design needed! Think of it as essentially an "iPhone in landscape mode" size canvas. You can populate the base HTML with something mimicking your real content to create the design, and start by allowing it to be picked up by 11ty for easier review, just shrink the viewport down to 600x315 ๐Ÿ‘๐Ÿป Hope that helps!

Collapse
geshan profile image
Geshan Manandhar

I was looking for a link to the jpg file :).

Thread Thread
5t3ph profile image
Stephanie Eckles Author

Ha, ok! Here's one - I update only the title and the episode number:

moderncss.dev/img/animated-image-g...