Skip to content

neilcarpenter/jquery-simple-social-sharing

Repository files navigation

Super simple social sharings with jQueries

Just for Twitter, Facebook and Google Plus at the mo, opens up proper share dialog, none of that cheap sharer.php?url=whatever crap.

Check the demo page here.

Usage

Mark up yo links as per:

<a data-[TYPE]="[SITE]" data-[CONTENT]="CONTENT" href="[CANONICAL SHARE URL]">Share on the [SITE]</a>

So for a real world example:

<a data-share="facebook" data-title="Gizoogle that shiznit" data-link="http://gizoogle.net" href="https://www.facebook.com/sharer/sharer.php?u=gizoogle.net">Tell your Facebook friends! They'll love it!!</a>

And then the jQuery:

$( parentContainer ).socialSharers();

It's using parent container for selector to allow event delegation, I'm presuming you would always have twitter and facebook buttons; google plus just to keep everyone happy. It doesn't matter if you only have one, still just use parent container, or just document, whatever.

And for some customisation extras:

$( parentContainer ).socialSharers({
	twitter: {
		handle: 'neilcarpenter' // will add 'via @neilcarpenter' on tweets
	},
	facebook: {
		appID: 144136645754967 // will load FB SDK asynchronously and add 'via [FB APP NAME]'
	},
	googleplus: {
		// no options yet
	}
});

All content / events are handled through data-* attributes on the links themselves, so your options are:

  • data-share => 'facebook' | 'twitter' | 'googleplus'
  • data-title => Title of content to share (fb), or share text (tw). Defaults to document <title>
  • data-link => Link to share. Defaults to current window.location.href
  • data-image => Picture to share (fb only)
  • data-description => Share text (fb only)
  • data-hashtags => Comma-separated list of hashtags (tw only)

About

Use Twitter and Facebook sharing as modals please, thanks.

Resources

License

Stars

Watchers

Forks

Packages

No packages published