Tuesday, August 2, 2016

How to add facebook page plugin widget in blogger site?

We have seen that almost all the blog, Facebook like Box Widget name has been added. Facebook said recently that the developer is Inbox- a massage, the Facebook like Box 015, after the June 3 will not work. According to the Facebook like box says ‍to update the Page Plugin. Facebook Plugin Widget Facebook like Box in the past than it was interesting to watch and very quick to load. Share Button like Button, both together and it has been added. Today I'll show how this update will add Facebook Page Plugin. The picture below to see a demo or live demo can be seen from the sidebar of my blog.

  • Step 1 - Add Facebook JavaScript SDK
Never shoot before you add the code below to your blog if you can skip this step. Of course if you do not have to add more to add.
1. Login into your blogger blog
2. Go to template > Edit HTML
3. And from the keyboard by pressing Ctrl + F of the search </body>
4. Paste Below Section of code before closing.
  <div id='fb-root'/>
(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/sdk.js#xfbml=1&version=v2.7";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
  • Step II - How to add Facebook Page Plugin
First you have to decide that, where you want to add it to your blog. I'll show you how to add a blog to the Side Bar.
    1. Now Click on Layout of the Blogger Dashboard
    2. Now, the right side of the layout, click on Add Gadget
    3. Click on The HTML / JavaScript
    4. Copy the following bar codes HTML / JavaScript and paste it into the box
      <div class="fb-page" data-href="https://www.facebook.com/prozokti/" data-small-header="true" data-adapt-container-width="true" data-hide-cover="true" data-show-facepile="true"></div> 
              5.Finally click save
            • Customization
            1. Two (Both) widget on your Facebook page Url replace "tutorialgift" this name.
            2. If you want to display the Header large data-small-header = "true" to be replaced by false 
            3. If you want to show Cover Photo data-hide-cover = "true" to be replaced by false
            4. Fan does not want to show images of data-show-facepile = "true" to be replaced by false
            Previous Post
            Next Post

            Show Comments: OR

            0 comments: Post Yours! Read Comment Policy ▼
            Attention Please
            No comments that are not related to the post can be made. Do not share your blog link without any reason. Always try to give positive comments. We evaluate all opinions equally and try to answer them in due course.

            Post a Comment

            Copyright © Poisa Click Registered Surf. Modified: PC Team, Server Hosted: GSE