Bloggin' la vida loca

Blogging about venture capital, entrepreneurship, technology and MBA studies

  • Blogread
  • Projectstry
  • About mehello

March 19, 2011
Posted by felix

Adding social features to your blog or website

Nowadays social features are more important than ever. This is why I decided to add a number of social features to this site and other projects I have started working on recently.

Now, the big question was which social features are important and how I can I integrate them as easily as possible. The most ubiquitous social sharing feature seems to be Facebook like button. Additionally, many sites offer “share on Facebook” and “post on Twitter” buttons, which I will discuss as well later in this article. Finally, I will also explain some points regarding other easier options using external service providers.

Facebook Like Button

A Facebook Like button can be integrated by visiting this Facebook page. Follow the instructions on the page titled as “Step 1″. Basically you have to enter the URL “to like” as well as some styling details. I entered some details for this very website www.schollmeier.info and got the following code snippet

<script src=”http://connect.facebook.net/en_US/all.js#xfbml=1″></script><fb:like href=”www.schollmeier.info” layout=”box_count” show_faces=”true” width=”450″ font=”verdana” colorscheme=”dark”></fb:like>

Including this code in the HTML of this article yields the following:

Quite easy, isn’t it? Well, it gets easier.

Share on Facebook

Facebook offers a special URL that can be used to share any page on Facebook. The magic URL is called: http://www.facebook.com/sharer.php

However, without the proper parameter this link is not useful. The URL takes two parameters, u for the URL/link of the document to be shared, and t for the title of the document to be shared. So, if we wanted to create a button or link to share this blog on Facebook, the resulting code would be:

http://www.facebook.com/sharer.php?u=http://www.schollmeier.info&t=Bloggin la vida loca

If you want to include this link on your website, simply modify the two parameters. You can then use the <a> tag to create a sharing button or link. In our case this could look as follows:

<a href=”http://www.facebook.com/sharer.php?u=http://www.schollmeier.info&t=Bloggin la vida loca”>Share on Facebook</a>

Share on Facebook

<a href=”http://www.facebook.com/sharer.php?u=http://www.schollmeier.info&t=Bloggin la vida loca”><img src=”http://www.schollmeier.info/wp-content/uploads/icons/facebook.png” alt=”Share on Facebook” /></a>
Share on Facebook

Post on Twitter

Creating a post on Twitter button is as easy as creating a share on Facebook button. Twitter also offers a URL to directly post a status to Twitter. The link is simply:

http://twitter.com/home?status=This blog rocks. Check out http://www.schollmeier.info

As you can see, you are able to post a status by modifying the status parameter in the URL above.  Knowing this you can create as many different buttons as you like, such as:

<a href=”http://twitter.com/home?status=This blog rocks. Check out http://www.schollmeier.info”>Share on Twitter</a>

Share on Twitter

<a href=”http://twitter.com/home?status=This blog rocks. Check out http://www.schollmeier.info”><img src=”http://www.schollmeier.info/wp-content/uploads/icons/twitter.png” alt=”Share” /></a>
Share

Other sharing options

Other options are also available, especially for webmasters that do not want to fiddle in their code. Personally, I like the service offered by AddToAny. It offers a number of options to customize the share button and you even have the option to pick from a large number of Add2Any plug-ins for Drupal, WordPress, etc.

I used the Add2Any form to create a quick share button for this very button and generated the following code:

<!– AddToAny BEGIN –>
<a href=”http://www.addtoany.com/share_save?linkurl=http%3A%2F%2Fschollmeier.info%2F2011%2F03%2F19%2Fadding-social-features-to-your-blog-or-website&amp;linkname=Adding%20social%20features%20to%20your%20blog%20or%20website”><img src=”http://static.addtoany.com/buttons/share_save_171_16.png” width=”171″ height=”16″ border=”0″ alt=”Share”/></a>
<script type=”text/javascript”>
var a2a_config = a2a_config || {};
a2a_config.linkname = “Adding social features to your blog or website”;
a2a_config.linkurl = “http://schollmeier.info/2011/03/19/adding-social-features-to-your-blog-or-website”;
</script>
<script type=”text/javascript” src=”http://static.addtoany.com/menu/page.js”></script>
<!– AddToAny END –>

Implementing this code yields the following button:


Share

An alternative good service is the AddThis which has the advantage – over Add2Any – that users have advanced analytics!

Icons & Co.

Finally, you will need some good icons if you do not want to use pre-packaged sharing services. Personally, I very much like the two icon sets by wpzoom. They offer two icon sets that are offered under the Creative Commons License for free, the social networking icon set and the developer icon set. Try them out, they are great!

Feel free to comment on this article or contact me directly if you have any questions.

No Comments

Posted Under Technology

No Comments Yet

You can be the first to comment!

Leave a comment

* = Required

    • Posts
    • Twitter
    • Flickr
     

    Venture capital,...

    Venture Capital

     

    How NOT to do PR:...

    Entrepreneurship

     

    Techbrunch is...

    Entrepreneurship

    Branding 101: Call yourself a microlender, not a loan shark...Doesn't change the representative APR of 1521.0% thoughhttp://t.co/j8iYiLPb

    follow me on
    twitter

    Sorry... I have not set my Flickr
    account up yet
  • Categories

    • Alternative Investments
    • Barcelona
    • Blog
    • Career
    • Entrepreneurship
    • Hedge Funds
    • MBA
      • IESE
    • Private Equity
    • Projects
    • Technology
    • Venture Capital
  • Archives

    • 2012
      • May
    • 2011
      • March
      • August
      • September
    • 2010
      • October
      • November
    • 2009
      • January
      • February
    • 2008
      • December
  • Blogroll

    • Ann’s Blog (USA, IESE MBA ’09)
    • Carmen’s Blog (Romania, IESE MBA ’09)
    • Jared’s Blog (USA, IESE MBA ’09)
    • Wei Yin’s Blog (China, IESE MBA ’09)

This site is using the Handgloves WordPress Theme
Designed & Developed by George Wiscombe

Subscribe via RSS