Screenshot a Facebook post

Use the HTML/CSS to Image API to autogenerate screenshots from Facebook.

How it works

To generate a screenshot of a Facebook post, we can make use of the Facebook embed feature.

For the image to work, make sure you set the selector param to .fb-post and ms_delay to 1500. This gives the embed extra time to load and has the API properly crop the image.

Example code

Copy this example, and swap out the href to create an image of any Facebook post you’d like.

Generate a screenshot of a Facebook post

HTML

<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v11.0" nonce="SOhYrMAR"></script>

<!-- See data-href below. Replace that with the link to your Facebook post -->
<!-- set ms_delay: 2500 to give it extra time toload -->
<!-- set selector: .fb-post -->
<div class="fb-post" data-href="https://www.facebook.com/HermanMiller/photos/a.171562157561/10158261466927562/" data-width="500" data-show-text="true"></div>

Important: set these parameters when creating the image.

selector: .fb-post
ms_delay: 2500

Try it yourself

Need help?

We’re always looking to improve this documentation. Please send us an email: support@htmlcsstoimage.com. We respond fast.