March 15, 2014

Add Facebook Like Button To WordPress And Blogger Post Guide

|
Method1: Adding Facebook Like Button To WordPress

1. Log in to WordPress Dashboard.

2. Go to Appearance >> Editor.

3. Select Single Post (single.php)

4. Paste the code below inside the post loop. 

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo
urlencode(get_permalink($post->id)); ?>&amp;layout=standard&
amp;show_faces=false&amp;width=350&amp;action=like&amp;colorscheme=light"
scrolling="no" frameborder="0" allowTransparency="true" ></iframe>


Method 2: Using A Plugin

Get your plugin here: http://wordpress.org/plugins/facebook-like-button/

Method 3: Add Like Button Directly From Facebook

1. Go to https://developers.facebook.com/docs/plugins/like-button

2. Select your preferred setting . The layout (design), width and action type. 

3. Then click the Get Code button.

4.  Facebook sign in box will pop up. Sign in to your account.

5.  Click on Get Code button again.

6.  A box with two set of  code will pop up. Copy the first one and paste it ideally right after the opening <body> tag.

7. Paste the shorter code wherever you want the plugin to appear on your page.

Add Facebook Like Button Below Blogger (Blogspot) Post Title.

1. Log in to Blogger Dashboard.

2. Go to Template.

3. Click on Edit HTML.

4.Look for <data:post.body/> in the template of codes.

Tip: How To Find <data:post.body/>

Press on Ctrl key without letting go and use another finger to press F key. A search box will pop up on top of the right hand corner of the template.

Paste <data:post.body/> in the empty box. Then press Enter key. You should <data:post.body/> highlighted in yellow color. 

5. Paste the code below ABOVE <data:post.body/>

<p><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp; action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:100px; height:20px;'/></p>

6. Click Save template.

That's how to add Facebook Like Button To WordPress And Blogger.