Advertise here with BSA

Hovercard is a jQuery plugin that eases displaying information with style when an HTML element of our choice is hovered.

The information box appears with a smooth fading effect and accepts any HTML markup to be used as the content.

It is very useful for enabling users to reach micro info quickly (like a short bio, price of an item, an image, etc.) and comes with built-in Facebook + Twitter integration. Simply, it can display the details of a Facebook page or Twitter user nicely.

There are options for defining its width, position, background color and more.

Also, callback functions exist when hovering in and out from a Hovercard item.

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

Advertisements:
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
Psd to Xhtml
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Advertise here with BSA

Sharrre is a jQuery plugin that eases creating social sharing widgets for Facebook,Twitter, Google Plus, Digg and Delicious.

The plugin calls the social buttons on demand which is great for minimizing the number of initial requests and improving loading speeds.

Any type of custom designs can be created for the widgets (no need to use the default buttons provided by the social networks) and events(like, +1, tweet, etc.) can be fired up with the plugin's API calls.

P.S. Google Plus widget requires PHP to work (the PHP file is already included in the package).

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

Advertisements:
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
Psd to Xhtml
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Advertise here with BSA

Web pages usually display multiple widgets of different networks (like Facebook Like, Tweet button, etc.) for social sharing.

ShareCount is an open source script that collects the number of sharing activities in a single counter.

The counter sums up the number of sharings of an URL in Twitter, Facebook, Digg and Delicious.

Also, it saves space by providing the ability use each social network's widget from the same button (that nicely toggles on hover).

The code of the script is pretty straightforward and it is easy to define new services.

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

Advertisements:
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
Psd to Xhtml
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Advertise here with BSA

It is usually a good practice to enable users to sign-in/sign-up using popular social service accounts like Facebook, Twitter, Google or OpenID.

Such an alternative not only fastens the process (no approval e-mails required, fewer form fields to fill, etc.) but also a "one less password to remember" from the user's perspective.

There are many social authentication providers besides the ones counted above including LinkedIn, Hotmail or Yahoo and integrating each can be a headache. Also, such codes may require to-be-updated from time-to-time to reflect any changes applied to them.

OneAll is a web service easing this process by providing a single API for using APIs of ~20 social services.

With the help of a "Social Login plugin", a widget that can be inserted to web pages with a copy-paste, users can be powered with an option to login with their social IDs.

A "Social Share plugin" empowers users to share their comments, purchases, reviews or other activities directly from the website with their friends on multiple social networks.

And, every action performed using OneAll (sign-in, sign-up, repeating visits, etc.) can be viewed in detail from its analytics interface.

It is hard to find such a service for free, however, OneAll is currently in beta (in-search of testers) and free during that period. Also, there will be a free plan once it is out-of-beta.

Update (18 Nov 2011) – There is now a WordPress plugin for the service which allows visitors to comment and login with social networks.

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

Advertisements:
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
Psd to Xhtml
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Advertise here with BSA

Twitter Bootstrap is a toolkit created by Twitter for kickstarting CSS when developing websites.

It is built with Less and consists of base CSS + HTML for typography, forms, buttons, tables, grids, navigation, and some more.

The grid provided is 940px wide 16-column and, for the layouts, there are solutions for both fixed + fluid ones.

Twitter Bootstrap's HTML elements have a plain-yet-elegant style where form inputs get a nice box-shadow on focus or table rows being highlighted.

The kit also includes other stuff like popovers, alerts, tabs and pagination which all use semantic XHTML.

It is actually built with Preboot, an open-source pack of mixins and variables to be used with Less and, for anyone willing to use it with Less rather than the static CSS, a detailed how-to is provided.

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

Advertisements:
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
Psd to Xhtml
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Advertise here with BSA

HybridAuth is an open source PHP library for authenticating through multiple social services and ID providers.

The services supported include OpenID,Facebook, LinkedIn, Google,Twitter, Windows Live, Foursquare, Vimeo, Yahoo, PayPal and more.

It can be integrated easily into existing websites by inserting a file and few lines to the sign-in/up pages.

Once authenticated, HybridAuth provides the connected user profile's in a rich, simple and standardized structure across all the social APIs.

And, besides authentication, the library enables us to interact with the social API client that the users are connected to.

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

Advertisements:
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
Psd to Xhtml
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Advertise here with BSA

Today's internet user interacts with others using many different services like Facebook, Twitter, blogs, etc.

Friendika, an open source PHP/MySQL application, integrates with such services and allows you to control your social networking stream from a single interface.

The supported services include Facebook, Twitter, WordPress, Blogger, Identi.ca, RSS feeds, e-mail integration and more.

Friendika is actually much more than that, it is a distributed social-network which doesn't require any 3rd party services and has its own Facebook-like features including, status updates, photo sharing/tagging, like/dislike, creating groups/fan pages or location sharing/geotagging.

And, the best part is; every Friendika user can connect with any other Friendika user on any installation without limits.

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

Advertisements:
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
Psd to Xhtml
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Advertise here with BSA

Streamie is a web-based, totally real-time and open source Twitter client which makes use of the latest web standards such as HTML5 and CSS3.

It has different menus for displaying mentions, direct messages, favorites or retweets. And, as expected, you can send tweets easily.

A number of options help customizing the application like message filtering, display settings and enabling geolocation.

The application is fully Ajaxed + uses nodeJS, less.js, require.js and Socket.IO which can be a good way of getting experienced in these "getting popular" resources.

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

Advertisements:
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
Psd to Xhtml
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Advertise here with BSA

At WRD, the previous tweet button for sharing stories was the cool Easy Retweet Button by John Resig. However, it was not perfect as, sometimes, it was unable to communicate with the URL shortener service and the tweet links were appearing buggy.

In search for a better one, I tested few others including the official tweet button. They were loading the links ok but had other issues like "loading slow", "blocking pages on load", etc.

And, for a button that is clicked by -maybe- 1/100 of the visitors, loading the scripts and making requests for every visitor didn't look like the smartest choice.

Here is another method, that is actually used at WRD now which loads very fast for everyone and almost fault-proof.

How it works?

First of all, the button is hosted locally and it does not make any requests until it is clicked.

• A link with the querystring that includes URL and the title of the web page is created, pointed to a server-side file (to be presented later in this article) and attached to any custom button we design.
• Once clicked, it sends the URL and title to the server-side file which creates the tweet link and redirects to Twitter with the tweet.

Pros

• Does not load any scripts from other domains (faster).
• Does not perform anything until being clicked (faster).
• Works with multiple URL shortener services. Currently, it uses Bit.ly by default, during the shortening, if there is an error, it falls back to Tinyurl. And if there is an error again, it uses the default URL. (fault-proof).
• Counts the number of characters used and, if more than 140, reformats it. (fault-proof).
• Any tweet button that you design can be used or just a "tweet it " text is enough (styleable).

Cons

• Does not display the number of retweets (as no requests are made on load).

The Code

It is built by PHP. You'll see that the code is simple and can be ported to any other scripting language quickly. Here it is:

<?php
/*
- A customizable, fast-loading and fault-proof tweet button.
- Built by Umut Muhaddisoglu (@umutm) of http://www.webresourcesdepot.com.
- Strict LTADSSIYND License (Listen To A Dire Straits Song If You Never Did)
*/
/* Requires Update - START */
$viaText		= ' (via @umutm)';
$bitlyLogin		= 'yourBitlyLogin';
$bitlyApiKey	= 'yourBitlyPass';
/* Requires Update - END */

/* ******************************No Need To Update Below****************************** */

/* Getting Post Variables - START */
$postURL 		= urlencode($_GET['postURL']);
$postTitle 		= html_entity_decode(htmlspecialchars_decode($_GET['postTitle'], ENT_QUOTES));
/* Getting Post Variables - END */

/* Bit.ly Shorten Function - START */
function getBitlyURL($theURL,$theBitlyLogin,$theBitlyApiKey) {
	return file_get_contents('http://api.bit.ly/v3/shorten?login=' . $theBitlyLogin . '&apiKey=' . $theBitlyApiKey . '&longUrl=' . $theURL . '&format=txt');
}
/* Bit.ly Shorten Function - END */

/* TinyURL Shorten Function - START */
function getTinyURL($theURL) {
	return file_get_contents('http://tinyurl.com/api-create.php?url=' . $theURL);
}
/* TinyURL Shorten Function - END */

/* Shorten URL - START */
$shortenedURL = getBitlyURL($postURL,$bitlyLogin,$bitlyApiKey);
if (strrpos($shortenedURL, "bit.ly") == false) {
	$shortenedURL = getTinyURL($postURL);
	if (strrpos($shortenedURL, "tinyurl") == false) {
		$shortenedURL = $postURL;
	}
}
/* Shorten URL - END */

/* Prepare Tweet - START */
$tweet = urlencode($postTitle) . urlencode(' - ') . $shortenedURL . $viaText;
$tweetLength = strlen($postTitle . ' - ' . $shortenedURL . $viaText);
$postTitleLength = strlen($postTitle);
$restLength = strlen(' - ' . $shortenedURL . $viaText);
$dotsMargin = 4; 

if ($tweetLength > 140) {
	$tweet = urlencode(substr($postTitle,0,140 - $restLength - $dotsMargin)) . urlencode('.. - ') . $shortenedURL . $viaText;
}
/* Prepare Tweet - END */

/* Redirect To Twitter - START */
header('Location: http://twitter.com/intent/tweet?text=' . $tweet);
/* Redirect To Twitter - END */
?>

The Button

It is possible to use a button you designed. At WRD, the "Official Tweet Button" images are used thinking that they will be the standard soon. If you prefer to use it too, here is the HTML-CSS for it:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Faster Tweet Button</title>
	<style>
	#tweetButton a {display:block;width:55px;height: 20px;background: url("tweetButton.png") 0 0 no-repeat;}
	#tweetButton a:hover {background: url("tweetButton.png") 0 -20px no-repeat;}
	</style>
</head>
<body>
	<span id="tweetButton"><a href="http://www.thedomain.com/tweet.php?postURL=changeWithTeURL&postTitle=changeWithTheTitle" target="_blank" rel="nofollow"></a></span>
</body>
</html>

How To Install?

Here are the steps:

• Open tweet.php and edit the Bit.ly user-pass of yours (it is free to get one) and the "via" text in the beginning of the file.
• Upload the file anywhere under your website.
• Link to your tweet button image with <a href="http://www.mydomain.com/tweet.php?postURL=<?php echo 'http://www.theURLOfThePage.com'?>&postTitle=<?php urlencode('The Title')?>"></a> by editing the URL and the title
• That's it.

For WordPress

After the first 2 steps above, for the 3rd step:

• Link to your tweet button image with <a href="http://www.webresourcesdepot.com/tweet.php?postURL=<?php echo get_permalink(); ?>&postTitle=<?php echo urlencode(get_the_title($post->ID)); ?>" target="_blank" rel="nofollow"></a>

Any thoughts to make it better?

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

Advertisements:
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
Psd to Xhtml
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Advertise here with BSA

Today, if not over-promoted, sharing your social activity or the content you generate in various ways is a good method to gain exposure.

WiseStamp is an add-on, with versions for Firefox, Chrome, Safari, Flock and Thunderbird, for  auto-inserting content from various resources to e-mail signatures.

Besides Thunderbird, it is compatible with the popular e-mail services like Gmail, Hotmail, Yahoo Mail and AOL.

The content inserted can be grabbed from a RSS feed, Facebook, Twitter, Digg, Delicious or almost any other social network account.

The add-on is multilingual and already has support for 10+ languages.

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

Advertisements:
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
Psd to Xhtml
SSLmatic – Cheap SSL Certificates (from $19.99/year)