Custom jQuery Social Share Buttons with Counters

Just another jQuery custom social share button plugin which uses Font Awesome 4 for social icons and shows the count that your URL has been shared on social networking sites. Currently works with Facebook, Twitter, Linkedin, Pinterest and VK.

How to use it:

1. Include Font Awesome 4 and the jQuery Social Button plugin's CSS in the head section.

<link rel="stylesheet" href="path/to/font-awesome.min.css">
<link rel="stylesheet" href="path/to/jquery.social-buttons.css">

2. Add custom social share buttons with counters to your web page.

<div class="social">
  <div class="social__item">
      <span class="fa fa-facebook" data-count="..." data-social="fb"></span>
  </div>
  <div class="social__item">
      <span class="fa fa-vk" data-count="..." data-social="vk"></span>
  </div>
  <div class="social__item">
      <span class="fa fa-twitter" data-count="..." data-social="tw"></span>
  </div>
  <div class="social__item">
      <span class="fa fa-linkedin" data-count="..." data-social="ln"></span>
  </div>
  <div class="social__item">
      <span class="fa fa-pinterest" data-count="..." data-social="pt"></span>
  </div>
</div>

3. Include jQuery library and the jQuery Social Button plugin at the bottom of your webpage.

<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="path/to/jquery.social-buttons.js"></script>

4. Initialize the plugin and done.

$('[data-social]').socialButtons();

5. Specify the URL you want to share.

$('[data-social]').socialShares({
  url: 'https://www.jqueryscript.net' 
});

---

This awesome jQuery plugin is developed by Belyash. For more Advanced Usages, please check the demo page or visit the official website.