Tuesday 15 September 2015
How to Add Facebook Like Button To Your Blog
The Facebook Like button enables
users to make connections to your pages and share content back to their
friends on Facebook with one click. It is easily to add the Facebook
Like button to your blog just by copy and paste simple HTML code to
your blog template as the following direction.
If you are using WordPress blog, open the single.php file of your theme and paste the following code into it:
If you are using WordPress blog, open the single.php file of your theme and paste the following code into it:
- <iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink());?>&layout=standard&show_faces=true&width=450&height=60&action=like&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none;overflow:hidden;width:450px;height:60px"></iframe>
You might want change the width and height of the iframe to fit your blog design.
If you are using the classic template of Blogger, paste the following code below the post content in the template:
- <iframe src="http://www.facebook.com/plugins/like.php?href=<$BlogItemPermalinkUrl$>&layout=standard&show-faces=true&width=450&height=60&action=like&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none;overflow:hidden;width:450px;height:60px"></iframe>
If you are using the modern version of Blogger, add the following code below the post content in the template, too:
- <iframe src="http://www.facebook.com/plugins/like.php?href=data:post.url&layout=standard&show-faces=true&width=450&height=60&action=like&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none;overflow:hidden;width:450px;height:60px"></iframe>
Since the iframe content is hosted by Facebook, the button can display
personalized content whether or not the user has logged into your site.
For logged-in Facebook users, the button is personalized to highlight
friends who have also liked the page.
You can see the code in action in the end of this post.
Subscribe to:
Post Comments
(
Atom
)
No comments :
Post a Comment