
goodshare.js

Useful jQuery plugin modern JavaScript solution for share a link from your website to social networks or mobile messengers. Easy to install and configuring on any of your website!
Features
Simple install, extensive documentation, developer support, SEO friendly, many options for customization of appearance, clean code without scripts tracking user activity on the page, high speed.
Full Documentation & Demos
Installation
Install via npm
:
$ npm install goodshare.js --save
Or include from jsDelivr CDN:
<script src="https://cdn.jsdelivr.net/npm/goodshare.js@4/goodshare.min.js"></script>
Usage
Script works with any HTML tags: <a>
or <div>
or <button>
or other.
So you can choose any and add required attributes data-social
.
For example:
<button data-social="twitter">Share this to Twitter</button>
<a href="#" data-social="facebook">Share this to Facebook</a>
<div data-social="linkedin">Share this to LinkedIn</div>
<i class="icon-google-plus" data-social="googleplus"></i>
By default, goodshare.js
search this tags for get title, description and image (for some social networks):
<head>
<title>Current page title</title>
<meta name="description" content="Current page description.">
<link rel="apple-touch-icon" href="http://example.com/path/to/image.png">
...
</head>
If you want to add different url
, title
, description
and image
to share element — use special data-*
attributes:
data-url
redefines document.location.href
data-title
redefines document.title
data-description
redefines meta[name="description"]
data-image
redefines link[rel="apple-touch-icon"]
Note: Please keep in mind, not all social networks support all of them data attributes!
To display share count, just add data-counter
attribute to HTML element that will contain numbers. For example:
<a href="#" data-social="facebook">
Share this to Facebook
<span data-counter="facebook"></span>
</a>
You also may put this attribute to any element.
Notes
- No more depending on jQuery! Since
4.x
, no longer support the old goodshare.js
version (3.2.9 and lower). Thank you jQuery, but ES6 is better and cleaner. - Browser support. Since
4.x
, goodshare.js
do not support Internet Explorer 10 and older (check ES6 support table).
Author & maintainers
Development and maintenance engaged by Vic Shóstak (aka Koddr).
If you want to say «thank you» and/or ask me about goodshare.js
— create new issue.
Your assistance will help make project even better!
Thanks for supporting!
License
The MIT License (MIT)