Sunday, August 4, 2013

How to Embed Any Facebook Post into Blogger Post?

Author: Gagan Masoun
Embed Any Facebook Post into Blogger Pos
Social giant Facebook is adding new feature to profiles. Now, you can embed any Facebook post (public only) into your blog or website with the help of new feature called “embedded posts”. It includes text post, photos and videos. For instance if your favorite celebrity or brand shared any photograph or status on his/her FB fan page, you can simply embed that post on your blog. Today, in this tutorial we will show you how to embed any public Facebook post into your blogger blog post. See example below:


Embedded Posts is currently available to a handful of news publishers, with a broader rollout coming soon.

But with the help of little trick you can embed any Facebook content on your blog even if “Embedded Posts” feature is not officially added to that FB account.

How to Embed Facebook Posts

Follow these easy methods and embed posts.

The "Embed" Option

Click on the little drop-down arrow next to a post, you will see an "Embed post" option, among other options.

Manually Creating an Embeddable Post

First of all copy the URL of the Facebook post you want to embed. To get a post's URL, simply click on its timestamp (see example).

Now, go to the Facebook Configurator tool. Paste your URL in the field provided. Click on Get Code. You will get two code segments that look something like this.

Use Facebook JavaScript SDK code if you've previously installed Open Graph or some Facebook widget. If this method is not working, then try given code.

<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="YOUR_URL_HERE"></fb:post>

Note - Replace YOUR_URL_HERE in the snippet above with the permalink that you just copied and paste the modified code anywhere in your blogger blog post. Done!

This method works 100% on WordPress and Blogger blogs. If you need any type of help from our side then ask us via comments below. Stay Tuned and God Bless :)

2 comments:

  1. Thank u gagan sir for the embeded code. it works. But on the right corner 'unlike' text appear. Have any idea to apera 'like' text with like link ?
    www.emazzaa.com

    ReplyDelete
    Replies
    1. If you already liked the embed post then it will show you 'unlike' text. Thanks for your comment. Stay tuned brother.

      Cheers...

      Delete