Add The Brand New Facebook Send Button To Your Blog

8:30 AM | , ,

Facebook have just created a brand new shiny button you can add to your blog for people to share your content.The button was released just today so it's not even a day old and you can be one of the first to have it on their blog, Yep people will be seeing it for the first time and checking it out on your blog ! So what is the new Facebook button and what does it do ?

When clicked a pop up appears for users to send the page of your blog they are on to their friends.But rather than posting on their wall as with the Like button the are sending by Direct Email.So you can enter the name of any facebook friend and send it to their Facebook Email or you can even enter the Regular Email of someone, for example their Gmail or Yahoo Mail address and the post will be sent to that Email.

How Cool Is That ! In a way it's a regular 'Email This' button with integrated Facebook Email.On a quick note have you activated your Facebook Email ? Go to your Facebook messages page and you will see a link at the top of the page to activate it.

Facebook also had their thinking hats on by making the new send button available in a new side by side combo format with the Like button.So were you have the like button on your blog now you can add the send button right beside it taking up no extra space.


You can try out the Facebook Send Button at the bottom of this and all posts on Spice Up Your Blog.

Now we seen the button and what it does lets add it to your blog.First up there are two ways you can have the button, in a combo with the like button and on it's own.I will give you the code for both and then we can see were to place it on your blog.

Wordpress And Other Blog Platforms - See how you get your send button here : Facebook Developers Send Button


Facebook Like And Send Combo Buttons Code :


<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<fb:like expr:href='data:post.url' send='true' show_faces='false' width='450'>
</fb:like><a href="http://www.createtheblogger.blogspot.com"><img alt="Best Blog Tips" src="http://img1.blogblog.com/img/blank.gif"/></a>


Standalone Facebook Send Button:

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:send expr:href='data:post.url'></fb:send><a href="http://www.createtheblogger.blogspot.com"><img alt="Best Blog Tips" src="http://img1.blogblog.com/img/blank.gif"/></a>



Add Your New Facebook Send Button To Blogger


The button can easily be added to your sidebars by pasting the code into a html/javascript gadget.Below i will show you a the two most popular positions on your blog for the buttons.

A. Directly Below The Post Titles At The Top Of All Posts.
B. At The Bottom Below All The Posts.


Add The Facebook Send Button To Your Blogger Posts


Step 1. For Both positions we go to your blogs html page, so in your Blogger Dashboard Click Design > Edit Html and Tick The Expand Widget Templates Box :

Design Edit Html Widget Templates

A - To place the button at the top of your posts Find the following piece of code in your blogs Html and paste the Facebook Button code Directly Below / Under It: (Click Ctrl and F for a search bar to help find the code):


<div class='post-header-line-1'>

If you cant find that look for this :

<div class='post-header-line-1'/>

B. To place the button at the bottom of your posts Find the following piece of code in your blogs Html and paste the Facebook Button code Directly Below / Under It: (Click Ctrl and F for a search bar to help find the code):

<div class='post-footer'>

Or Alternatively Below This Code :

<data:post.body/>

Once you have the code in position save your template and check out your cool new Facebook Send Button.

OK as i said this new Facebook Social button has just been released so you can be one of the first to get it.Make sure to check out more of our Facebook Posts and Social Media Posts.

Drop Your Comments Below.

No comments:

To Use A Smiley In Your Comment, Simply Add The Characters Beside Your Choosen Smiley To The Comment:
:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =)) Grab Smily Gadget

Post a Comment

 
Gadgets By For Bloggers