After two days(now its way faster than that) of searching and testing I got it. Finally I got the facebook like button to work properly on my blog. Here's how I did it.
First Goto to http://developers.facebook.com/docs/reference/plugins/like/ . Here you will get the required code to insert the like button.
Select the required options as you want, the most important is the URL to Like. It is where you set the post or website which you want to link like button.
For now just type anything there (need to be changed if for blog posts). In Layout Style if you just need a small like box then choose the "button_count".
In the width option, if you chose "button_count" then 150 will just be enough for you. Enter 450 if you want a bit detailed view.
Show Faces shows the Profile Picture of the one who liked the page.
After you click on Get Code a pop-up box will appear showing you the code.
I tried with the other methods HTML5 and IFRAME, the result was not like as I wanted so I chose XFBML.
Choose XFBML for now.
You like button must be up and running after this. Do ask if any questions.
Click here for The iframe method.
First Goto to http://developers.facebook.com/docs/reference/plugins/like/ . Here you will get the required code to insert the like button.Select the required options as you want, the most important is the URL to Like. It is where you set the post or website which you want to link like button.
For now just type anything there (need to be changed if for blog posts). In Layout Style if you just need a small like box then choose the "button_count".
In the width option, if you chose "button_count" then 150 will just be enough for you. Enter 450 if you want a bit detailed view.
Show Faces shows the Profile Picture of the one who liked the page.
After you click on Get Code a pop-up box will appear showing you the code.
 |
| Select XFBML for now and I guide you to rest. |
Choose XFBML for now.
- First you have to do is copy the code in second box. You don't need to copy all, just copy the xmlns:fb="http://ogp.me/ns/fb#"
- Now Go to Blogger and Overview(Dashboard)> Template> Edit HTML. Tick the "Expand Widget Template". You can backup the Code in Notepad if any error occurs.
- Find your
<HTML ...tag. copy the above code and paste before the ">" of the HTML tag. - Now Find
<data:post.body/>Then right below the line paste the code from the First Box(above image). - Then paste another code from the third box(above image) , to the another line below.
Important: Now change the code of third box href='post.url' to expr:href='data:post.url'. This gives the link of the post you are currently viewing.
You like button must be up and running after this. Do ask if any questions.
Click here for The iframe method.
Well,I must say you saved an ass here.This very awesome. .
ReplyDelete