Social Bookmarking - MediaWiki

Exclusive offer: get 50% off this eBook here
MediaWiki Skins Design

MediaWiki Skins Design — Save 50%

Designing attractive skins and templates for your MediaWiki site

£14.99    £7.50
by Richard Carter | June 2009 | MySQL Open Source PHP

In this article by Richard Carter, we will learn social bookmarking.

Social bookmarking allows people to "bookmark", or make a note of, the websites they like or find useful, and share these bookmarks with other social bookmarkers while surfing the Internet.

Traditionally, bookmarking was done through Internet browsing software, such as Internet Explorer, Safari, Firefox, or Opera. With social bookmarking, your bookmarks are not confined to one browser, but are stored online.

The following two options are available for enabling social bookmarking on your website:

  • Link to each individual social bookmarking service that you wish to use
  • Use a social bookmarking aggregator such as Socializer or AddThis

Even if you do not have links to allow visitors to bookmark your website, many services allow their users to install toolbars in their browser, which allows your website to be added anyway. Adding these links will help to spread your wiki and its new skin very fast.

Individual Social Bookmarking Services

There are huge numbers of social bookmarking services on the Internet, and quite a number of these have become reasonably popular. We will look at some of the more popular bookmarking services such as:

  • Mister Wong
  • Furl
  • Facebook

Your Wiki's Audience

One thing to consider before adding social bookmarking service links to your wiki is your audience. For instance, if your wiki is technology-related, you may find it better to use Digg than Facebook, as Digg is more popular than Facebook for your wiki's intended audience. If your wiki's visitors are primarily from Germany, you may find Mister Wong more useful than Furl, because Mister Wong is more popular with the German users.

There are many other social bookmarking services available, including Del.icio.us (http://del.icio.us) and StumbleUpon (http://stumbleupon.com), which you can use after asking your wiki's visitors by means of a poll, or following simple experimentation.

Example of Audience

durhamStudent (http://durhamStudent.co.uk) is a niche website aimed at students of Durham University in the UK:

Social Bookmarking - MediaWiki

The durhamStudent website uses both the methods of social bookmarking discussed earlier, providing links for eKstreme's Socializer and a link to an individual bookmarking service, Facebook:

Social Bookmarking - MediaWiki

Facebook was linked individually here because it is incredibly popular among the students at Durham University (indeed, the Durham network is only open to those with a university email address). Although Facebook's bookmarking service is accessible through Socializer, it is also linked separately as the website's target audience is more likely to use that service than any other.

Mister Wong

Mister Wong, http://www.mister-wong.com, is popular with German and other European users (though not so much in Great Britain), and allows the users to store their bookmarks while maintaining their privacy, with the ability to set bookmarks as "public" or "private".

Social Bookmarking - MediaWiki

Generally, the social bookmarking services ask for two pieces of information when creating a link from your website to them: the URL (address) of the page or website you want to add, and the title of that page or website, as you wish it to be posted.

Linking to Mister Wong

To link to Mister Wong, create a link where you want your social bookmark to be shown in your MediaWiki template in the following format:

http://www.mister-wong.com/index.php?action=addurl&bm_url=www.example.
com &bm_description=Your+Website

Spaces are automatically escaped with a "+" sign by the majority of social bookmarking services. You don't have to worry about properly escaping spaces in the title of your link when linking to bookmarking services.

To use these services with MediaWiki, we will be required to use some PHP. In particular, we will need the following:

  • The page's title, which we can get with <?php $this->text('pagetitle') ?>.
  • The website's address, retrievable with <?php $this->urlencode('serverurl') ?>.

For simplicity, we will assume that our visitors will always want to bookmark JazzMeet's homepage, http://www.jazzmeet.com. Thus, the code in our MediaWiki template would appear as follows:

<a href= "http://www.mister-wong.com/index.php?action=addurl&bm_url=www.jazzmeet.com 
&bm_description=JazzMeet" title="Bookmark JazzMeet with Mister Wong">Bookmark JazzMeet with Mister Wong</a>

What Mister Wong Users See

If a visitor to your wiki decides to bookmark your wiki with Mister Wong, they will be greeted with a screen similar to the following, with fields for the address of the website (URL), title, related keywords ("tags"), and a comment about the website:

Social Bookmarking - MediaWiki

They are also given the option to bookmark as either "public", allowing other Mister Wong users to see it, or "private", which restricts the bookmarked website to their account only.

MediaWiki Skins Design Designing attractive skins and templates for your MediaWiki site
Published: August 2008
eBook Price: £14.99
Book Price: £24.99
See more
Select your format and quantity:

Furl

Furl, http://www.furl.net, has functionality that is similar to Mister Wong.

Social Bookmarking - MediaWiki

Linking to Furl

Very similar to Mister Wong, you can create a link to bookmark a particular page in MediaWiki by inserting the following in to your skin template:

<a href= "http://www.furl.net/storeIt.jsp?t=JazzMeet&u=www.jazzmeet
.com" title="Bookmark JazzMeet with Furl">Bookmark JazzMeet with Furl</a>

What Furl Users See

Furl has the same features as Mister Wong. But the Furl team has added its own twist to social bookmarking, with the added features of being able to add a rating (out of five stars), marking the bookmark as "read" or "unread", and creating "groups" to better organize your bookmarked websites:

Social Bookmarking - MediaWiki

This information is provided by the user, so you don't need to specify any more parameters in addition to the page title and your wiki's address.

Facebook

Facebook (http://facebook.com) is a very popular social networking site that allows people to share photographs with each other. In 2006, Facebook launched its social bookmarking feature.

Social Bookmarking - MediaWiki

To link to Facebook's social bookmarking service, we can use the following code:

<a href= " http://www.facebook.com/sharer.php?u=http://www.jazzmeet.
com" title="Bookmark JazzMeet with Facebook">Bookmark JazzMeet with Facebook</a>

Note that we do not need to specify the page's title, as Facebook will automatically insert this, along with an (optional) image and a brief description of your website.

What Facebook Users See

Facebook's sharing features are a lot more limited than other social bookmarking services. The user is given an option to change the title or the address being bookmarked, and write a short description of the website:

Social Bookmarking - MediaWiki

Once posted, the link is visible in the poster's feed:

Social Bookmarking Aggregators

Rather than attempting to put every single social bookmarking site link in your MediaWiki skin template, there is a simpler way. We can use a social bookmark aggregator such as eKstreme's Socializer, or AddThis.

AddThis

AddThis (http://addthis.com) is the "number one bookmarking and sharing button".

Social Bookmarking - MediaWiki

Linking to AddThis

Linking to AddThis is easy as there is a wizard-style, step-by-step guide for creating and customizing your button. AddThis gives you a number of choices as to how it looks and acts for your wiki's visitors. Firstly, it can be used as a single button:

Secondly, a "drop-down" version with JavaScript can be used, which provides an instant access to the more popular bookmarking services:

Social Bookmarking - MediaWiki

You may need to register for an "AddThis" account to gain access to the code that will be required.

Socializer

ekStreme's Socializer (http://ekstreme.com/socializer) is another social bookmark service aggregator.

Social Bookmarking - MediaWiki

Unlike AddThis, Socializer does not have a drop-down "widget", so to use it you can just link to it as you would do in any other website.

You can create a new browser window by adding target="_blank" to the relevant link attribute. You could use this to prevent your wiki's visitors from losing their place on your wiki when they bookmark it. But it may irritate some visitors who are accustomed to opening a new tab in their browser by using the central mouse button.

Linking to Socializer

Linking to Socializer is similar to linking to Mister Wong or Furl's social bookmarking services.

What Socializer Users See

Socializer users are presented with a list of bookmarking services, with a more popular group towards the top of the screen:

Social Bookmarking - MediaWiki

Social bookmarking for JazzMeet

As JazzMeet's visitors are likely to be from a wide range of backgrounds, we will use eKstreme's Socializer for JazzMeet's social bookmarking.

Insert the XHTML given earlier in JazzMeet's skin template, below the article's content, aligned to the right:

Social Bookmarking - MediaWiki

Summary

In this article, we have discussed social bookmarking services such as Furl and Facebook.


If you have read this article you may be interested to view :


MediaWiki Skins Design Designing attractive skins and templates for your MediaWiki site
Published: August 2008
eBook Price: £14.99
Book Price: £24.99
See more
Select your format and quantity:

About the Author :


Richard Carter

Richard Carter is a web designer and frontend web developer based in Newcastle upon Tyne in the North-east of England.

His experience includes many open source e-commerce and content management systems, including Magento, MediaWiki, WordPress, and Drupal. He has worked with clients including the University of Edinburgh, University College Dublin, Directgov, NHS Choices, and BusinessLink.gov.uk.

He is a creative director at Peacock Carter Ltd (peacockcarter.co.uk), a web design and development agency based in the Northeast of England. He graduated from the University of Durham in Software Engineering. He blogs at earlgreyandbattenburg.co.uk and tweets as @RichardCarter.

Magento 1.8 Theme Development is Richard's seventh book. He has previously written MediaWiki Skins Design, Magento 1.3 Theme Design, Magento 1.4 Theme Design, Joomla! 1.5 Templates Cookbook, and The Beginner's Guide to Drupal Commerce, Magento Responsive Theme Design, and acted as a technical reviewer on MediaWiki 1.1 Beginners Guide, Inkscape 0.48 Illustrator's Cookbook, and Apress' The Definitive Guide To Drupal 7.

Books From Packt

WordPress 2.7 Cookbook
WordPress 2.7 Cookbook

Expert Cube Development with Microsoft SQL Server 2008 Analysis Services
Expert Cube Development with Microsoft SQL Server 2008 Analysis Services

WordPress 2.7 Complete
WordPress 2.7 Complete

eZ Publish 4: Enterprise Web Sites Step-by-Step
eZ Publish 4: Enterprise Web Sites Step-by-Step

Apache Maven 2 Effective Implementations: RAW
Apache Maven 2 Effective Implementations: RAW

Building Enterprise Ready Telephony Systems with sipXecs 4.0: RAW
Building Enterprise Ready Telephony Systems with sipXecs 4.0: RAW

Solr 1.4 Enterprise Search Server
Solr 1.4 Enterprise Search Server

Flex 3 with Java
Flex 3 with Java

 


Code Download and Errata
Packt Anytime, Anywhere
Register Books
Print Upgrades
eBook Downloads
Video Support
Contact Us
Awards Voting Nominations Previous Winners
Judges Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software
Resources
Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software