Sharing the love – Make it easy for your users

Update : http://www.siphilp.co.uk/archive/2008/04/03/sharing-the-love—update.aspx

A week ago I wrote a post about using your statistics for post ideas and two things that have emerged since then are the “share this” aspect of my blog and just how bad my comments look.  This post is going to cover the process of making it easier for users to submit my posts to numerous social websites.

I am trying not to change alot on my current skin as I am focusing on my subtext skin articles and my new upcoming skin however, I thought this topic was perfect for a quick post as it’s something I have implemented in my new skin and I feel that it will “freshen” up what’s here just now.

First I would like to say that there are a two ways to accomplish what I am about to do so I will cover both.

• Using Sharethis.com
  • Subtext Implementation
  • WordPress Implementation
• Adding your own
  • Subtext Implementation
  • WordPress Implementation

 

Using Sharethis.com

I first discovered this on Si Joblings site and instantly thought that’s a good idea.

I signed up on sharethis.com and found the “wizard” that allowed me to Customise my widget.  Customisation is quite good.  You can change the colour of the links, header background and the colour of the tabs. The wizard also allowed me to choose what social sites I would like to include.  After me playing about with the different colours I finally hit the generate code button.

“Backup before you change anything”.

Subtext implementation

Navigate to Skins<skin directory you’re using>controls

Open the “ShareThisPost.ascx” control. Within the control you’ll find an unordered list with maybe four links

• Email It
• Bookmark It
• Digg It
• Kick It

If you’re thinking of adding your own then I would make any changes here and go to the next section “Adding your own”.

Copy everything inside the

<div class=”share”>

</div>

paste this in notepad (we’ll be using this later).

and within the div paste the code that the wizard generated on sharethis.com. Just after the script

Just after the </script> tag put in the following tag

<noscript></noscript><br /><br />

The information we pasted on notepad now needs to be pasted in between the no script tags.

Save it -> Upload it.

Before

 

After

If javascript is turned off then the before screen links take effect 🙂 

Adding your own – Subtext

My new theme will probably use sharethis.com’s widget but I will be extending the <noscript> scenario to include others.  To add your own look at the code that’s there

for example the “digg it” link looks like

<a href=”http://digg.com/submit?url=<%# UrlEncode(Entry.FullyQualifiedUrl) %>&amp;phase=2″ title=”digg it”>digg It</a>

What we’re interested in is <%# UrlEncode(Entry.FullyQualifiedUrl) %>.  This broken down is

Diggs Submit page -> Our post URL encoded -> Link Title

To add our own. Lets say StumbleUpon we add the following

<a href=”http://www.stumbleupon.com/submit?url=<%# UrlEncode(Entry.FullyQualifiedUrl) %>”>StumbleUpon</a>

That’s it. Just need to know the format of the submit page and mark it up like the above.