Hi! Everyone, hope you all are fine.
In this post I will tell you how you can use Facebook Like Button in your Blogger.com blog. Few people asked me how they can use Facebook like button on their blogger blog so here it is. If you don’t have a blog in Blogger then you can create it now.
1. Go to your Blogger Dashboard --> Design --> Edit HTML --> now tick the Expand Widget Templates for the following blog in which you want to use Facebook Like Button.
2. Search for the following code (to bring the browser search box press Ctrl + F or F3)
a) If you want to use it before post and after title
<p class='post-header-line-1'>b) If you want to use it after post ends
<data:post.body/>3. Now place the following code just after any of the above code
<b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=true&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:70px;'/>
</b:if>a) Things you might need to change
(1)
layout=standardYou can change
standard to button_count if you only want to show the button with no. of likes(2)
show_faces=trueYou can change
true to false if you don’t want to show the face(3)
action=LikeYou can change
Like to Recommend if you want to show recommend instead of like(4)
font=arialYou can change
arial to (a)
lucida+grande(b)
segoe+ui(c)
tahoma(d)
trebuchet+ms(e)
verdanaUse anyone of follow font you like
(5)
colorscheme=lightYou can change
light to dark depending on your template color(6) change the
width:450px and height:70px depending on your template(7) If you want to show Like Button in home page also then remove the following codes
<b:if cond='data:blog.pageType == "item"'>
</b:if>4. Now click on SAVE TEMPLATE, now check your blog everything is working fine
5. Now everything is fine now again come to Edit HTML page for the same blog
6. Now find opening head tag you will get it at the top of the page.
<head>7. Paste it just below the head tag
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='Your Profile ID' property='fb:admins'/>
<meta content='Category of your Blog' property='og:type'/>i) Things you need to change
(1)
Your Site Name change it with the name of your site(2)
Your Profile ID change it with your profile ID (If you want then you can remove the Profile ID line)(3)
Category of your Blog choose the category of your blog from Facebook open graph page to go to Facebook open graph page Click here.Note:- Before editing your Blogger template take the backup of your template by going to Blogger Dashboard --> Design --> Edit HTML --> now click on Download Full Template for the safe side.
2 comments:
i tried alot of times , but , it doesn't work !! i don't know why's that !!
As I show in your blogs (which are in your blogger profile) it's working fine...
So may I know what problems you are facing?
Post a Comment
Recommended While Commenting Please Add Your Name And Not To Add Your Email ID Till It Is Not Asked By Me "Saket Jajodia"...
Note: Only a member of this blog may post a comment.