Friday, September 7, 2012

How to add floating Facebook Like Box to Blogger

I've just added a floating Like Box found in the right section of this page, so viewers could easily subscribe to my updates on Facebook.

As we all know, Facebook is the number one site in the world, and most people nowadays do not miss logging on to their Facebook accounts each day. So for bloggers, the easy and cool way to get the most out of it is to bring Facebook to your visitors. If they found your article a good read, then they wouldn't be hesitant on liking your own Facebook Page.

But did you know how to add this widget on Blogger? Here's a preview of how the Like Box should look like:



Are you ready? You just need to follow these simple steps:

(1) Login to your Blogger account (and make sure you are using the new interface).
(2) Go to Template > click on Edit HTML > click on Proceed > check Expand Widget Templates. This is how your page appears as of this step:


(3) Now add the following code just before the </head> tag.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript">
</script>

(4) Save your template and Proceed to Layout. Now click on Add Gadget and choose HTML/JavaScript.

(5) Now add the following code in the Content section of the HTML/JavaScript. Leave the Title section empty.


Just take note that you need to replace reynthology in this HTML/JavaScript code. For example, if your Facebook Page username is technews, then your URL should be like this:

http%3A%2F%2Fwww.facebook.com%2Ftechnews

This is how your page appears as of this step:


(6) Click the Save button and you will be directed back to your Layout. No need to place the HTML/JavaScript gadget on anywhere you want it to appear, because the code will automatically place the Like Box on the upper right side of your blog.

If you have properly done the steps, then your blog should now be properly displaying the floating Facebook Like box!







Facebook Comments

blog comments powered by Disqus