Thursday, February 18, 2016

[New post] Easily Add Facebook Recommendation To Blogger

Post : Easily Add Facebook Recommendation To Blogger
URL : http://enews-update.com/easily-add-facebook-recommendation-to-blogger.html
Posted : February 18, 2016 at 1:27 pm
Author : eNews Update
Tags : Blogger Plugins, FacebookTricks, Social Sharing, widget
Categories : blogging

Boost Traffic With Facebook:

Everybody knows importance of social networking site like Facebook.com, YouTube, Twitter. One of them is Facebook which is one of the best way to boost traffic. Facebook allow us to create Facebook fan page through which most of the traffic a website can receive. Now officially Facebook introduced a plugin called "Facebook recommendation Bar" for blogger through which we can boost our traffic easily.

How It Works?

Facebook recommendation bar will collapse on page load and expand when a reader has reached a specific location on your blog or he has finished reading the post. The recommendation bar will show the post which was previously liked or shared on facebook. this also shows as thumbnail with picture and title of article. It also shows how many likes the article got by how many person. Like button is present in top on plugin screen.

How To Install It On Blogger?

I have wondered almost one week wondering why this plugin not working on some templates. Many blogs you may have seen to offering you to install meta tags and other things, but today I will show you a very easy process which I have discovered after searching on many blogs and I have checked on many templates and its working. Actually it is a little conception of java-script.

Step1: "Create Facebook Application"

* Login into Facebook Apps ( https://developers.facebook.com/apps/ ) page
* Clock on Create New App button at top right on page.
* Now a pop up box will appear,just type any name like My Fans Plugin and leave other field blank and click continue.

http://enews-update.com/wp-content/uploads/2016/02/Facebook1.09.png     4.  Enter the captcha security code. Click Submit.

5. Almost we are done . Now click website with Facebook Login and enter your website URL in the box  and click Save Changes . See screenshot below.

http://enews-update.com/wp-content/uploads/2016/02/Facebook1.14.png
    6.  Now you can see two line of alpha numeric code. One is App Id and other is App secret, so we need App Id . Just copy the app id and save it to notepad because later we need it.

http://enews-update.com/wp-content/uploads/2016/02/Facebook1.24.png
Congrats you have successfully created your new app.

Step2: Add "Facebook Recommendation Bar" blogger template

* Go to Blogger > Template
* Backup your template
* Click Edit HTML > Proceed
* Search For this :

>           <html

Replace it with this code:

>          <html xmlns:fb='http://ogp.me/ns/fb#'

This will make the plugin compatible in older versions of  internet explorer also. Since blogger templates are coded in XML therefore inserting this XML namespace will enhance the plugin performance and compatibility.
5. Next search for <body>   and just below this tag paste the following code:

> lt;/b:if></b:if>
> <div id='fb-root'/>

You are almost done. Make these changes:

* Replace *************** with your 15 digit App Id that you saved in step 1.
* Replace http://www.enews-update.com ( http://enews-update.com )  with your blog link

Save your template and you are all done!
Visit your blog and scroll down and you can see the changes or wait for 15 seconds.

Need Changes?

Below are optional customization and control options. You can skip them if you want

* max_age: will decide the age limit of articles. Sometimes you don't want to display too old articles so you can set it to display up to 1-180 days old posts. But if you don't want to take age into account then let it be 0 as default.
* num_recommendations: You can set how many articles to display. By increasing or decreasing the value 3
* read_time: As soon as the user reaches a specified location, the plugin would expand and before expanding it will take some time. I have kept it equal to 10  seconds, you can increase it to 30 or more as you wish.
* side:  You can decide the location of plugin. By default it shows up towards the bottomright corner of your page. You set it to float to left
* trigger:  On page load the plugin collapses and as soon as it reaches a specified location it expands. You can choose that location in three ways i.e. onvisible, X% or manual. I prefer locating the trigger point by percentage for better pageviews. The widget will expand as soon as the user scroll downs 40% of your page. You can increase or decrease this value. If you wish that the plugin must expand as soon as the reader reaches the end of your article then instead of pasting the code between the purple lines  paste it just below data:post.body tag and use the value onvisible instead of 30%.

The widget will display only on post pages and not on homepage or static pages. To display it on all pages, then simply delete the purple bolded lines. Now save the Template and see if your Plugin working correctly or not.

Hope this installation was not hard and if you face any problem do comment us we will  help you

 

Add a comment to this post: http://enews-update.com/easily-add-facebook-recommendation-to-blogger.html#respond

--


Manage Subscriptions
https://subscribe.wordpress.com/?key=129c7c98475ead01f0f253b8e6bf7aaa&email=adilameer313.leti%40blogger.com

Unsubscribe:
https://subscribe.wordpress.com/?key=129c7c98475ead01f0f253b8e6bf7aaa&email=adilameer313.leti%40blogger.com&b=LCS9Mw8Amz%3Fdh%26Dkhn%3FcSH%2FYY.%5BU%5BysQVntad5jK%5B8WQhMp38Mn

No comments:

Post a Comment