Share This (jQuery): a WordPress plugin

Monday, 30 July 2007

I have made a useful modification to Alex King’s excellent Share This WordPress plugin. Share This adds a nice popup to your posts allowing readers to easily submit the post to any number of social networking and news sites. The original version relies on the large Prototype JavaScript library, which adds to the download size for the page. Share This only uses a sprinkling of its features, so I wanted to replace it with something smaller.

I have recently redesigned this website; it now uses the marvellous jQuery library for some of the effects. So to avoid having to include Prototype, I modified Share This to use jQuery instead of Prototype. If you want to reduce the time taken for your pages to load, you could replace the original Share This with my version; this is is especially good if you are already using jQuery.

To use this version of Share This, first install the original Share This (version 1.4), and then download Share This (jQuery) and replace the original share-this.php file with the new one. Read on for more details.

Here are the changes I made, compared to version 1.4 of Share This.

Use jQuery instead of Prototype.
jQuery is included in WordPress 2.2 and later versions. For earlier versions, you should download jQuery and copy it into the wp-includes/js/ directory in your WordPress installation. Make sure the file name is jquery.js.

Behave nicely if somebody tries to load the plugin file directly.
If someone tries to load the share-this.php file directly, just show a blank screen. The original version shows an error message.

Use a sliding “roller blind” effect when showing the Share This popup window.
Just because it looks nice.

Remove some unused code.
Because it was unused.

My modifications are in the public domain.

Now, there is one other change. The position of the popup window is not the same in all browsers; in some browsers (such as Firefox) the popup appears below the “Share This” link; in others (such as Internet Explorer) the popup appears just to the right of the link. I don’t mind the inconsistency: both variations look nice in themselves.

I thought about using the Dimensions plugin to emulate the original Share This more exactly. But in the end I decided to keep things simple and avoid introducing yet another file.

Tags: , , ,

31 comments

You can leave a comment, or trackback from your own site.

  1. It seems that you and I had the same idea – I also re-wrote Share This in jQuery, though I released mine after yours and used the Dimensions plugin you mentioned.

    I’ve linked to your page here from my site since your plugin seems to be more polished.

    Cheers!

  2. I just stumbled upon Share This. I wonder if I have to replace all alexking.org’s in your php file with my domain?

  3. Alter Falter, you don’t need to make any changes. That “alexking.org” string is used to load the text strings for internationalisation.

  4. I am updating a friend’s site and added Share-this as I really like it’s compact function. I’ve updated her to WP 2.2.3. When I click the Share This link it opens in a whole new window instead of a small pop-up. I then came across your version which I installed and plugins now shows Share This (jquery) 1.4+.

    I’m still getting a whole new screen. You can see it at http://www.trulysandra.com Any suggestions? Thanks for the plugin upgrade and your help!

  5. Christine, this looks like a problem with the theme.

    In IE the blog uses the Tiga theme and Share This works fine. In Firefox it uses the Natural Essence theme. It looks as if this theme does not call the wp_footer hook, which is necessary for Share This to do its popup magic; this is why it has to open a separate window.

    You might want to contact the Natural Essence theme author and get this fixed. (Or you could add the hook yourself…)

  6. Thanks, Bennett. You saw two different themes because you caught me in the middle of testing lol. I realized the same problem – tiga worked and several others didn’t so had to be themed related. I added the to the footer.php and it is working fine now. Thanks, again.

  7. Hey, I love this plugin, and found out about yours because I was sick of running prototype(70kb) just for it. But I dont really want to run jquery either. Is there anyway to just edit the code a little bit so the user can just go to the “share this” page and use the function there instead of the drop down menu that requires javascript?
    Thanks

  8. everytime I enable this plugin the CPU usage on my server goes WAY up, do you know why this would happen?

  9. Bob, you can add the following line to the code after line 423:

    $onclick = '';

    So lines 423-425 then look like this:

    }
    $onclick = '';
    global $post;
    

    This is a quick-n-dirty solution but it should work.

  10. Chris, If the problem happens with the original Share This, then you should get support from Alex. If it only happens with my modified version, then let me know.

  11. Ill enable the original and will let you know. Thanks 🙂

  12. yeah I just tried the original and it did not affect cpu usage at all.

  13. OK Chris. My questions then:
    1. Does the 100% CPU usage happen at the moment you activate the plugin only?
    2. How long does it last?
    3. Does the plugin work correctly after activation? (Apart from the CPU usage)
    4. What version of WP are you using? What other plugins?
    5. What OS and version of PHP are you using?
    Any other info you can think of may also be helpful. Thanks…

  14. it spikes up immediately and kind of goes up and down a bit, but stays high. I deactivated it after a little while because it slowed things down. Its on WP 2.21. PHP 5.2.2. I think the server uses linux, but its dreamhost so Im not sure

  15. Thanks for this modification

    Greetings!

  16. Hey, first of all nice plugin!

    Got a little problem though … When visiting archive or category pages on my site the share this link doesnt work. It is just plain text and I cant figure out how to either get rid of it or give it a use.

    It works fine on home page and single post pages …

    site URL is: http://new.deborre.net problem at: http://new.deborre.net/?m=200810

    I am just developing the site so most of it isnt working yet …

    Would be very nice if you could help me,
    Julian

  17. Thank for this one, nice plugin

  18. Just wondering..

    How i manually include the Share This link, instead of doing of its own?
    Something like .. because i want to make it part of my layout, near the title, as icon.

Leave a comment