Compact facebook share button with count?

I am trying to add a simple compact fshare button on my website. The only code I found was this one:

<div style="float:left;padding:4px;">
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/>  
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>
</div>

Which sho开发者_JAVA技巧uld render as

But it is not redering correct. It seems it is trying to create multiple buttons and "crashes" all the page. It corrupts the HTML, change the background of a entire div and so on...

Why is that? Is this the correct code?

Facebook is not recommending the use of the share button anymore, instead you should use the like button. Here is what they say on their website:

We don't recommend the Share button for new developers. If you aren't already using the Share button, we recommend you migrate to the Like button and Open Graph protocol instead of Share for sharing pages from your website. The Like button is simpler to user and is the recommended solution moving forward.

With the like button, you can add it using javascript OR iframe, so you can see which one works best for you. Read more about the like button here.

http://sharethis.com provides a widget that allows you to include buttons for various social media sites, including the fb share button with count. (It has their own style and size so you may need to override some of the CSS to make it look like the standard FB share.) There is also a solution at http://blog.pixert.com/facebook-share-button/, but I have not been able to get it to display a count.

Change your code

 <a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/> 

to

<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'>Share</a>