How To:Add Facebook Like & Google Plus +1 Button to WordPress Post without Plugin

By | November 25, 2011

Advantages of Facebook Like Button

Facebook is the world most visited social networking site & it almost holds the worlds population.Every one from class 5 to Grandparent now has an account in Facebook.Most people stay connected 24*7 using their mobiles devices.Each user has news feeds where they see updates from friends.This news Feed shows their like and comments to their friends.Now if you have 500 friends and like or comment it would be shared with all then in their wall as feeds.The interesting one is the Facebook ticker which helps to get more connected with friends activities,like & comments.If your friend likes your comment it would be instantly shared with his friends too.

e.g.,X =50 Friends,Y= 200 Friends.

If you(x) have 50 friends and from that 1 friend(y) like your comments.Then the activity would be shown  to his 200 friends(y) group through feeds that he has commented on you(x) post.

This helps websites to promote without pain of work.
Facebook wordpress google plus 1

How to Add the Facebook Like Button in WordPress

Now that you know that Facebook button is very useful,lets add it to WordPress post page’s.First open single.php file from your theme folder.Then past the following code inside the post loop:

<iframe src="//; ?>
font=trebuchet+ms&height=" frameborder="0" scrolling="no" width="320" height="240"></iframe>

There are parameters which could be changed.

If you want to show friends profile picture use this,


changing the count button display,then use this parameter


Change the button to dark theme,then use this parameter

Colour scheme=dark

Change like to recommendation,then use this parameter


Advantages of Google +1 Button

Right now it is not the most used social networking platform but it can boot you site in seach results.It look like it will have good future since google is adding the +1 button to all its platforms.

<script type="text/javascript">// <![CDATA[

  (function() {

var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;

po.src = '';

    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);


// ]]></script>
<!-- Place this tag where you want the +1 button to <span class="hiddenSuggestion" pre="to ">render</span> -->

<!-- Place this <span class="hiddenSuggestion" pre="this ">render</span> call where <span class="hiddenSuggestion" pre="where ">appropriate</span> -->

There are parameters which could be changed.

To change the size of the button

size=tall ,Medium,Small,Standard.

To change the type of the button

annotation=inline ,bubble

After adding the code move it with the help of the CSS code so it could be placed at the right position.

Leave a Reply

Your email address will not be published. Required fields are marked *

Human Verification: In order to verify that you are a human and not a spam bot, please enter the answer into the following box below based on the instructions contained in the graphic.