Facebook PHP

How to Create Custom Share Buttons for Facebook, Twitter, LinkedIn, Google Plus & Delicious?

Interested in sharing your content on Facebook, Twitter, LinkedIn or delicious? Do multi-option social media sharing tools such as ShareThis seem like overkill?

That was our conclusion after researching the social media sites on which readers are most likely to share content from our blog focused on solutions to a wide range of business challenges, What Works for Business. We decided that Facebook, LinkedIn, delicious, Google Plus and Twitter were the sites on which our target business audience is most likely to share business-related content. Rather than using the ShareThis widget which provides many more options (many confusing options for most of our readers), we decided to create custom share buttons.

To add custom share buttons automatically to each post in a WordPress blog, add the following code to single.php, the file which renders the individual post (note that you must be using WordPress.org, the self-hosted version of WordPress, to be able to customize the php files).

Facebook Share Button Code

Here is the Facebook share code, which can also be found at http://www.facebook.com/share_partners.php/.

<script>function fbs_click() {u=location.href;t=document.title;window.open(‘http://www.facebook.com/sharer.php?u=’+encodeURIComponent(u)+’&t=’+encodeURIComponent(t),’sharer’,’toolbar=0,status=0,width=626,height=436′);return false;}</script><a href=”http://www.facebook.com/share.php?u=<url>” onclick=”return fbs_click()” target=”_blank”><img src=”ADD_IMAGE_URL_HERE” alt=”Share on Facebook” /></a>



LinkedIn Share Button Code

Here is the LinkedIn share code, which can also be found at http://www.linkedin.com/static?key=developers_widget_shareonlinkedin.

<a href=”http://www.linkedin.com/shareArticle?mini=true&url=<?php the_permalink(); ?>&title=<?php the_title(); ?>&source=ADD_YOUR_BLOG_URL_HERE”><img src=”ADD_IMAGE_URL_HERE”></a>

delicious Share Button Code

Here is the delicious share code, which can also be found at http://delicious.com/help/savebuttons.

<a href=”http://delicious.com/save” onclick=”window.open(‘http://delicious.com/save?v=5&amp;noui&amp;jump=close&amp;url=’+encodeURIComponent(‘<?php the_permalink() ?>’)+’&amp;title=’+encodeURIComponent(‘<?php the_title() ?>’),’delicious’, ‘toolbar=no,width=550,height=550′); return false;”><img src=”ADD_IMAGE_URL_HERE” height=”20″ width=”20″ alt=”Delicious” /></a>

Google plus Share Button Code

Ever wanted to give your readers, or your client’s readers a chance to share the post quickly on google plus?

<a class=”gplus_icon” href=”https://plusone.google.com/_/+1/confirm?hl=en&url=<?php echo urlencode(get_permalink()); ?>&redirect_uri=<?php echo get_permalink( );?>” target=’_blank’></a>

Twitter Share Button Code

Ever wanted to give your readers, or your client’s readers a chance to share the post quickly on Twitter?

The code is straight forward:

<a href=”http://twitter.com/home?status=Currently reading ” title=”Click to share this post on Twitter”>Share on Twitter</a>

If you’re using WordPress and want to automate this, simply use the following to insert the link to the current post in the loop into your link:

<a href=”http://twitter.com/home?status=Currently reading <?php the_permalink(); ?>” title=”Click to share this post on Twitter”>Share on Twitter</a>