ADD Facebook share and like button to a blog post

When i searched for facebook social options for my blog posts so that it will be useful for readers to share, I found many options

YOU Can use share buttons directly on the post and when the user clicks, it opens a dialog box or shares it directly



TYPES:

1. ADDTHIS
2.Direct method
       

1.ADDTHIS:
                     
                       This method make use of a site called ADDTHIS where you can generate code for various social option


1. GOTO addthis

2. Signup for a free account

3.Goto generate code>>share option

 you cam customize the type of button and other social option

1.select website option to get code
2.select blogger for installing a widget of share

You can use this function for wordpress also


FEATURES :

1. you can use this code with any HTML template
2.You will get complete analytics of the share buttons
3.Free of cost
4.Get the details of no. of clicks on the buttons

Disadvantage:
         
1.This method will make the website to load slow
2.Requires some time

2.DIRECT METHOD:
            
                  This method is more easy and does not require any additional websites,links etc..

FOR facebook Like button:
  
Follow the below steps carefully

Step 1 : 
 Login to blogger.com , Go to your Blogger dashboard , Click on template , Edit Html , Click on Expand Widget Templates  and  Place Facebook JavaScript SDK Code give below on  Blogger template  , Just after opening of your > Tag or Just Before closing  of your > Tag ,, you can also ass Code between tag .this Code plays important role Without this Facebook JavaScript SDK Code your Facebook code will not work properly for Multi-page ,By placing this Facebook JavaScript SDk code in < Body > tag , Every post of your blogger blog will work fine with proper counting

Step 2 : 
 Now Place any one code out of Code 1 or Code 2 or Code 3 or Code 4 or Code 5 or Code 6  in blogger , where you want to render Facebook like Button . You can add this Code to blogger using Add widgets  , also you can Facebook like button below post title .

THESE CODES ARE GOT FROM SHOUTINGBlogger

Code 1  : Facebook Standard button along with send button |   Preview :

<!-- Place this Facebook Standard like code Where you want to see --><div class="fb-like" data-send="true" data-width="450" data-show-faces="false"></div><!-- End of Facebook Standard like code -->

                                             OR

Code 2  : Facebook Simple like and Send button |  Preview :

<!-- Place this Facebook like button with couter code Where you want to see --><div class="fb-like" data-send="true" data-layout="button_count" data-width="450" data-show-faces="false"></div><!-- End of Facebook Standard like code -->

OR

Code 3  : Facebook Like box counter and send button |  Preview :

<!-- Place this Facebook like Box code with counter Where you want to see --><div class="fb-like" data-send="true" data-layout="box_count" data-width="450" data-show-faces="false"></div><!-- End of Facebook Standard like code -->

Code 4  : Facebook Standard Like button with counter |  Preview :

<!-- Place this Facebook Standard like code with counter Where you want to see --><div class="fb-like" data-send="false" data-width="450" data-show-faces="false"</div><!-- End of Facebook Standard like code -->

Code 5  : Facebook simple Like button with counter |  Preview :

<!-- Place this sinmple Facebook like code with counter Where you want to see --><div class="fb-like" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div><!-- End of Facebook Standard like code -->

Code 6  : Facebook simple Like box button with counter |  Preview :

<!-- Place this Facebook like box code with counter Where you want to see --><div class="fb-like" data-send="false" data-layout="box_count" data-width="450" data-show-faces="false"></div><!-- End of Facebook Standard like code -->