jSocial

A Social Networking Plugin

This is a simple plugin to add your social networking sites & icons in a list to display on your website!

This is a first version, and includes a few options which I hope to expand on. Very easy to use, simply include the script, and add your usernames or URL's in the call,drop in a div and the plugin does the rest.

Minimum requirements to use, be sure to include jQuery and the plugin itself;

				<script src="js/jquery.jsocial.js" type="text/javascript" charset="utf-8">
			

And to activate it add the function call and pass in your names/options;

				<script type="text/javascript" charset="utf-8">
					$('.social').jsocial({
						
						//options and usernames here
					});

				</script>
			

Then place this where you want the list to appear;

				<div class="social"></div>
			

The sweet icons used here are the result of hard work by Rogie King of Komodo Media. Please include an attribution link back to him if you use these images.

Making and using your own images is simple! For large icons use size of 32x32 pixels and 16x16 pixels for the small size. I recommend using CSS Sprites Generator for awesome ease.

Included Social Networks (so far):

• Twitter
• Facebook
• Flickr
• Delicious
• FriendFeed
• Linked In
• YouTube
• Digg
• Last.FM
• Feedburner

User editable options:

• Auto Center List
• Display Inline. Horizontal or Vertical
• Open Links in New Page
• Display Using Small or Large Icons

All Networks

This list calls all the networks, and uses the options to display inline and center itself inside a div.

		$('.social').jsocial({
			twitter		:  'ryanolson',
			facebook	:  'facebook.com/thatryan',
			flickr		:  'thatryan',
			delicious	:  'thatryan',
			linked		:  'linkedin.com/in/thatryan',
			youtube		:  'youtube.com/thatryan1',
			feed		:  'thatryan',
			friendfeed	:  'thatryan',
			digg		:  'thatryan',
			lastfm		:  'thatryan',
			center		: true,	
			inline		: true

		});
	

Select Options

Here we call just a few networks and use the small icons.

		$('.social2').jsocial({
			twitter		:  'ryanolson',
			facebook	:  'facebook.com/thatryan',
			flickr		:  'thatryan',
			delicious	:  'thatryan',
			linked		:  'linkedin.com/in/thatryan',
			small		: true

		});
	

Download Here!