{"id":246,"date":"2007-08-01T23:35:29","date_gmt":"2007-08-02T04:35:29","guid":{"rendered":"http:\/\/unitstep.net\/blog\/2007\/08\/01\/share-this-in-jquery\/"},"modified":"2007-08-07T18:04:17","modified_gmt":"2007-08-07T23:04:17","slug":"share-this-in-jquery","status":"publish","type":"post","link":"https:\/\/unitstep.net\/blog\/2007\/08\/01\/share-this-in-jquery\/","title":{"rendered":"Share This in jQuery"},"content":{"rendered":"

Share This icon Copyright Alex King (http:\/\/alexking.org)<\/a><\/p>\n

Share This<\/a> is an excellent WordPress plugin written by Alex King<\/a>. The plugin provides a neat and customizable pop-up menu for allowing readers to easily share one of your blog posts using many of the social bookmarking or social websites out there. It’s an intelligent solution to the problem of having too many sharing icons<\/a> that may potentially distract or irritate readers.<\/p>\n

Since launching, Share This has become very popular<\/a>, with many blogs using it. I recently began using the plugin for a site of mine, and was impressed by its usefulness. (And the icon project it launched<\/a>) However, I had also decided to use the jQuery<\/a> JavaScript framework (and its plugins<\/a>) for this site, and since Share This uses Prototype<\/a> for its JavaScript functionality, there were some conflicts. <\/p>\n

So, I decided to do a minor re-write of Share This, altering only the JavaScript portion to use jQuery instead of Prototype.<\/p>\n

<\/p>\n

jQuery?<\/h3>\n

I wanted to stick with jQuery for a variety of reasons, but mainly because I have more experience with it than with Prototype. I won’t get into an argument over which of the frameworks is better, and will instead stick to the “Unto each his own” line of thinking.<\/p>\n

While jQuery generally works well with existing JavaScript, as it doesn’t alter the global namespace, and additionally has a “no-conflict” mode, some of the plugins that I wanted to use (specifically Thickbox<\/a>) weren’t written for the no-conflict mode. The issue stems from the use of the “$<\/code>” variable name. In jQuery, it’s a shortcut for the be-all-end-all function jQuery()<\/code>, while in Prototype, it’s a shortcut for document.getElementById()<\/code>.<\/p>\n

Share This in jQuery<\/h3>\n

Before I offer the download, I want to make it clear that this was a very minor<\/strong> change – no functionality was added or removed, as just the JavaScript portion was re-written (quickly) to support jQuery instead of Prototype. Again, it’s not better than the original Share This<\/a>, only different. Furthermore, 100% full credit still belongs to Alex King<\/a>, as this is barely a derivative work.<\/p>\n

In order to use this version, you will need the jQuery framework<\/a> as well as the Dimensions plugin<\/a>. Their cumulative compressed sizes are comparable to the compressed size of the Prototype framework. You will need to link them to your site in your WordPress theme’s header.php<\/code> file by adding lines like these, preferably between the head<\/code> tags.<\/p>\n

<script type=\"text\/javascript\" src=\"\/path-to-jquery\/jquery.pack.js\"><\/script>\r\n<script type=\"text\/javascript\" src=\"\/path-to-jquery-dimensions\/jquery.dimensions.pack.js\"><\/script><\/code><\/pre>\n
You can then replace the original share-this.php<\/code> with the jQuery version in the zipped download<\/a>.  (You may want to backup the original file first, as always)<\/p>\n
Download<\/h3>\n