How To Embed Facebook Posts to Blogger, Wordpress Or Any Website!

Tweet

This Wednesday Facebook has just launched another Social Plugin which is currently in Beta stage and is being improved. Like Twitter, Facebook now allows Post Embedding. Just a small piece of code that allows you to take someones post and embed it on your Blog or Website. You can embed any post like video, photo, status, hashtags etc.. But you can only embed posts that are public, so if you want to embed a post, make sure it is public else it won't work. For now, this feature is only working for some popular pages like Bleacher Report, CNN, Huffington Post, Mashable and PEOPLE only.  Does that mean you can't embed other posts until facebook rolls out this over your page? Hell No!  here is a simple trick to do that in Blogger, Wordpress and other Websites manually: Related: How To Add Facebook Like Box In Blogger Step 1: First you need to get the link of your "Public" post that you want to embed. Make sure the post is Public. To get the link go to the Timeline Right-click on the time of your post and select Copy link address Step 2: Paste this code where you want your embedded post to appear: <div id="fb-root"></div> <script> (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; 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')); </script> <fb:post href="POST_LINK"></fb:post> Replace the POST_LINK with the link of your post that you copied in Step 1. Example: https://www.facebook.com/ZenusPlace/posts/484613484953036 This is how the code should look: <div id="fb-root"></div> <script> (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; 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')); </script> <fb:post href="https://www.facebook.com/ZenusPlace/posts/484613484953036"></fb:post> and this is the working demo of an embedded facebook post from our page into this blog post: As i said earlier you can embed your post anywhere you want, means you can also embed your facebook posts in your blog posts using HTML Editor. It also works on Wordpress, and any other website where you are allowed to edit the HTML of your pages. Hope this was helpful and you learnt something new. Leave a comment below if you have any question or need any help. Cheers!!

This Wednesday Facebook has just launched another Social Plugin which is currently in Beta stage and is being improved.

Like Twitter, Facebook now allows Post Embedding. Just a small piece of code that allows you to take someones post and embed it on your Blog or Website.

You can embed any post like video, photo, status, hashtags etc..

But you can only embed posts that are public, so if you want to embed a post, make sure it is public else it won't work.

For now, this feature is only working for some popular pages like Bleacher Report, CNN, Huffington Post, Mashable and PEOPLE only. 

Does that mean you can't embed other posts until facebook rolls out this over your page?
Hell No!  here is a simple trick to do that in Blogger, Wordpress and other Websites manually:

Related: How To Add Facebook Like Box In Blogger

Step 1:

First you need to get the link of your "Public" post that you want to embed.
Make sure the post is Public.

1. To get the link go to the Timeline
2. Right-click on the time of your post
3. and select Copy link address

Step 2:

Paste this code where you want your embedded post to appear:

<div id="fb-root"></div>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id))
return;
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'));
</script>
<fb:post href="POST_LINK"></fb:post>

Replace the POST_LINK with the link of your post that you copied in Step 1.

Example: https://www.facebook.com/ZenusPlace/posts/484613484953036

This is how the code should look:

<div id="fb-root"></div>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id))
return;
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'));
</script>
<fb:post href="https://www.facebook.com/ZenusPlace/posts/484613484953036"></fb:post>

and this is the working demo of an embedded facebook post from our page into this blog post:

As i said earlier you can embed your post anywhere you want, means you can also embed your facebook posts in your blog posts using HTML Editor.

It also works on Wordpress, and any other website where you are allowed to edit the HTML of your pages.

Hope this was helpful and you learnt something new. Leave a comment below if you have any question or need any help. Cheers!!