The simplest way to handle your social media buttons. All you need is one script!
Forget loading those clunky SDKs for Facebook, Twitter and Google+. This plugin loads your social media buttons in the background, unobtrusively and simultaneously. And the best part, you get to fully customise the styling.
Download or clone the repo
Include the minified JS file after including jQuery (preferably before the closing <body> tag, works with jQuery 1, 2 & 3):
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="jquery.kyco.easyshare.min.js"></script>
Optionally include Font Awesome and the provided CSS in the <head> tag.
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet">
<link rel="stylesheet" href="jquery.kyco.easyshare.css">
Now, copy the api/easyshare.php file to your server and remember the path. Open jquery.kyco.easyshare.min.js and replace kyco.API_PATH with the path to where you copied the file, e.g. //my.website.com/path/to/easyshare.php.
Finally copy & paste the markup below to fire it up.
<div data-easyshare data-easyshare-url="https://www.kyco.io/">
<!-- Total -->
<button data-easyshare-button="total">
<span>Total</span>
</button>
<span data-easyshare-total-count>0</span>
<!-- Facebook -->
<button data-easyshare-button="facebook">
<span class="fa fa-facebook"></span>
<span>Share</span>
</button>
<span data-easyshare-button-count="facebook">0</span>
<!-- Google+ -->
<button data-easyshare-button="google">
<span class="fa fa-google-plus"></span>
<span>+1</span>
</button>
<span data-easyshare-button-count="google">0</span>
<!-- Twitter -->
<button data-easyshare-button="twitter" data-easyshare-tweet-text="" style="margin-right:15px;">
<span class="fa fa-twitter"></span>
<span>Tweet</span>
</button>
<div data-easyshare-loader>Loading...</div>
</div>
- Leave
data-easyshare-urlempty or completely remove it to get share counts for the current URL. - For twitter, use
data-easyshare-tweet-textto pre-populate the tweet. - In
api/easyshare.phpchangeheader('Access-Control-Allow-Origin: *');toheader('Access-Control-Allow-Origin: http://your.domain.here');for better security.
- By default the plugin retrieves share counts for both HTTP and HTTPS.
- Increase plugin speed by explicitly setting
data-easyshare-httpordata-easyshare-httpson the main div to force getting share counts for the specified protocol only. - If your site is running HTTP then it is a good idea to add
data-easyshare-http. - If your site has always been running on HTTPS then add
data-easyshare-https. - If your site has migrated from HTTP to HTTPS then ignore or add both.
Note: Twitter has discontinued their tweet count. There is no official means of getting the tweet count and hence it has been removed from this plugin.
Note: The v1.0.2 API has been discontinued. Users of v1.0.2 will have to migrate to the latest version.
For bugs or improvements please use the issues tab or email [email protected].