It is a smart technique which encourages visitors to share a story by offering a quite fun usage.

Nettuts+ is sharing a very nice tutorial (with source) that enables you to implement this feature using jQuery & jQuery UI.

It makes use of the draggable & droppable components of jQuery UI to make drag’n dropping & targeting objects possible.

To see how it works, a demo is provided as well.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• MooTools-JSON Event Calendar: MooGenda
• jQuery Event Calendar Plugin: jMonthCalendar
• Drag’n Drop JavaScript Time Picker
• Drag’n Drop Calendar With jQuery: FullCalendar
• Zoom Script With A Smart Interface: TJPzoom

It is an unobtrusive JavaScript file for displaying a retweet link with a shortened URL via Bit.ly (similar to Tweetmeme) & number of clicks came to that content from Twitter.

Easy Retweet Button has 2 ready-to-go styles: vertical & horizontal. And it can be easily themed as only HTML, CSS & JavaScript is used.

It is possible to customize the "Retweet" text, prefix of the tweets (like RT @..) & Bit.ly username / API key to be used.

It offers various advantages like:

• speed: it works completely asynchronously
• tracking: all the tracking is done via Bit.ly & clicks from retweets can be tracked from a single interface

Steps For Using It With Wordpress:

This is nothing complicated but can save your time:

• Create a "js" folder in your active theme & upload Retweet.js into this folder
• Include the Retweet.js to your theme. There are 2 options:
  • You may want to use retweet links only inside your post details (single.php) page. So, it is a better decision to include Retweet.js only into single.php to prevent unnecessary loading. In your template’s folder>header.php>between your head tags:
    <?php
if ( is_single()) {
?>
    <script src="<?php bloginfo('stylesheet_directory'); ?>/js/retweet.js"></script>
<?php
}
?>
  • If you will use it site-wide (your homepage, post details, etc..) simple include the JS file to your template’s folder>header.php>between your head tags:
    <script src="<?php bloginfo('stylesheet_directory'); ?>/js/retweet.js"></script>
• For using it inside post details (single.php), insert the code below to any part of your template’s single.php file:
  <a class="retweet" href="<?php echo get_permalink(); ?>" rel="nofollow"><?php the_title(); ?></a> . Besides the original examples of Easy Retweet Button, rel=nofollow info is added considering the link has no value to search engines.
• And, you may want to get a free account from Bit.ly & update the username & API key info inside Retweet.js to reach your stats from a single interface.

P.S. A demo of the script can be found below the title of every post at WebResourcesDepot.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• Display Tweets With PHP/Ajax: Ptwix
• Ajax-Powered Mash Up Engine: Afrous
• Zoom Script With A Smart Interface: TJPzoom
• YUI Slideshow: Customizable And Animated Slideshows
• What You See Is What You Ajax: WaveMaker

It supports the most popular sites like Digg, Delicious, StumbleUpon, Technorati, Facebook, Google and Reddit.

The look & feel of the social bookmarking menu created with the component is totally customizable. It is possible to change:

• the icons to be displayed
• the size of the icons
• the aspect of the hint text for the icons
• details regarding the bookmarked data.

Flash Bookmarks can be both added by drag’n drops from the component panel of Flash or by code (AS3).

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• 81 Social Bookmarking Icons In Various Sizes
• Instant Website That Displays Content From Multiple Feeds/Services: Pubwich
• Hand Drawn-Doodle Social Bookmark Icons
• Good Looking Social Bookmarking Menu
• Customizable And Free Social Bookmarking Script

Twitter, getting bigger & better, is also another powerful network where content can reach to thousands easily in minutes.

To help the readers of a website share/tweet a content at Twitter easily, here is a simple way of integration:

You can send a querystring to Twitter like:

http://twitter.com/home?status=Your Tweet. For example, a tweet link for this post can be:

http://twitter.com/home?status=How To Add Tweeting With Short URL Functionality To A Website (With PHP): http://www.webresourcesdepot.com/how-to-add-tweeting-with-short-url-functionality-to-a-website-with-php/

The problem & the solution:

There is a 140 character limit in Twitter & the length of the URL is a headache. So, auto-shortening the URL with a short URL service will be handy.

The file_get_contents function of PHP helps us to easily get the short URL as a string. Lets use the TinyURL service & create a simple function:

<?php
function makeShortURL($URLToConvert) { 
     $shortURL= file_get_contents("http://tinyurl.com/api-create.php?url=" . $URLToConvert); 
     return $shortURL; 
}
?>

So, calling the function with the URL, like:

<?php echo makeShortURL("http://www.webresourcesdepot.com/how-to-add-tweeting-with-short-url-functionality-to-a-website-with-php/")?>

will result in: http://tinyurl.com/arbz2e.

And the link to this post will become:

http://twitter.com/home?status=How To Add Tweeting With Short URL Functionality To A Website (With PHP):http://tinyurl.com/arbz2e

For Wordpress users:

Wordpress users can add the makeShortURL function to the functions.php in the active theme folder.

Important, make sure you don’t leave any spaces between other functions & at the bottom of the functions.php file. Else, the RSS feed will have some trouble in creating the XML files.

And, in the single.php file, where the posts are displayed, use the line (or update it to your needs) below:

<a href="http://twitter.com/home?status=<?php the_title(); ?>: <?php echo makeShortURL(get_permalink())?>" rel="nofollow">Tweet This Post</a>.

And that’s all.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• ScheduledTweets: Free And Fully Ajaxed PHP Application To Schedule Tweets
• Open Source PHP App. To Display Tweets Of Users You Follow: Twitster
• Open Source Image Hosting Script: Chevereto
• Instant Website That Displays Content From Multiple Feeds/Services: Pubwich
• Display Tweets With PHP/Ajax: Ptwix

The menu (created from an unordered list) simply hides a portion of the social bookmaring icons & displays them when hovered.

It is ready to be used for Wordpress blogs with the related tags defined but can be used on any website by updating the links.

It has all the major social bookmarking websites included.

P.S. It is the revisited version of this menu.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• Free Flash Social Bookmarking Component
• Customizable And Free Social Bookmarking Script
• Hand Drawn-Doodle Social Bookmark Icons
• Digg Type Menu With CSS
• Digg Clone Module For Drupal: Drigg

It provides you the base & enables you to easily create/customize bookmarking links.

How to use it?

• insert sbookmark.js to your webpages
• call the function for the preferred bookmarking site like: <a href="#" onclick="sbs_delicious(); return false;">...</a> for delicious.com.

In short, it saves your time from learning the submission formats of each social bookmarking website.

In the download page there is also a social bookmarking images pack.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• Hand Drawn-Doodle Social Bookmark Icons
• Good Looking Social Bookmarking Menu
• Free Flash Social Bookmarking Component
• 81 Social Bookmarking Icons In Various Sizes
• Instant Website That Displays Content From Multiple Feeds/Services: Pubwich

Once clicked, a window with the social bookmark website logos appears. Clicking the desired social bookmarking website does not redirect you to another website, a hovered window like Lightbox opens and the new website runs there. This nice feature helps keeping your website visitor on your page.

There is also a Wordpress plugin which helps integrating mooSocialize into a Wordpress powered blog.

Name says it all but mooSocialize is built with the beautiful mootools javascript framework.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• JavaScript Widgets Library: Meteora
• What You See Is What You Ajax: WaveMaker
• Open Source Ajax Push Engine: APE
• Mootools Star Rating With Rabid Ratings
• Moo.rd: Lightweight JavaScript Library Based On Mootools