Facebook has a new feature... or rather borrowed a feature from twitter. You can now embed any Facebook post on your website or blog. Be it a video post, photo upload or even a status update. If it is on Facebook and is shared publicly, you can add it on your site.

Embedding posts has many benefits.

  • Referencing an actual Facebook post brings more reliability to your content.
  • People can like the post directly from the embedded version without having to visit Facebook.
  • You can easily display a copyrighted photo from a Facebook post in your site without violating any rules.

Here's an embedded version of one of my Facebook posts.

Embedding Facebook Post on Web Page

What you need to do is to add a small piece of code where you want to embed the post. As of now, only a select few publishers like CNN, Mashable etc have been granted access to this code, but the feature is actually available to all.

Here's a tool that makes it easy for you. Copy the post's URL (Link of the post date or time) from Facebook, paste it into the text box below and click "Generate". You can then copy-paste the generated code into your web page to embed that post.

Enter URL and click "Generate" to get the embed code.

How it works.

The actual embed code for any Facebook post would look like this -

<div id="fb-root"></div>
(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id))
    js = d.createElement(s);
    js.id = id;
    js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
<fb:post href="POST_URL"></fb:post>

The tool replaces the POST_URL with your url and gives you the formatted code.
Idea Credit: Amit Agarwal.