Unless you’ve been hiding in a cave for the last five years, you’ll know social bookmarking is the way forward for online marketing. By adding Facebook Like, Tweet This or Google +1 buttons to your website, you can increase visitors to your website with very little work. It’s free, extremely effective and very easy to setup.

However, I’ve been speaking to quite a few people recently who struggle to understand the fundamentals of online marketing and getting the basics on their website.

On a recent project, I was keen to include the three main players in the social marketing arena in a consistent format. You are often supplied with a variety of choices to get the buttons on your website but very few look similar apart from the “large” buttons (normally vertically stacked with a count of clicks above the button).

Share on Facebook, Twitter & Google

By way of sharing my findings, I thought it may be useful to others who are also keen to standardise the appearance of their social sharing buttons as well with the following code (just replace yourwebsite.com with your website address – obviously).

Facebook Like

<iframe src="http://www.facebook.com/plugins/like.php?app_id=145583522190869&amp;href=http%3A%2F%2Fwww.yourwebsite.com&amp;send=false&amp;layout=box_count&amp;width=50&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=90" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:90px;" allowTransparency="true"></iframe>

(Source)

Tweet This

<a href="http://twitter.com/share" data-url="http://www.yourwebsite.com" data-count="vertical" data-via="yourusername">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

(Source)

Google +1

<!-- Place this tag where you want the +1 button to render -->
<g:plusone size="tall" callback="http://www.yourwebsite.com/"></g:plusone>
<!-- Place this tag after the last plusone tag -->
<script type="text/javascript">
  window.___gcfg = {lang: 'en-GB'};

  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>

(Source)