jQuery Plugin For Custom Social Buttons with Share Counts - POP'n SocialButton

File Size: 47.4 KB
Views Total: 2666
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin For Custom Social Buttons with Share Counts - POP'n SocialButton

POP'n SocialButton is a jQuery approach to create custom social buttons with share count badges on your website, fully customizable via CSS.

Social networking services supported:

  • Twitter
  • Facebook
  • Hatebu
  • Google Plus
  • Pocket
  • Github( via githubRepo option)
  • Feedly( via feedUrl option)

Basic Usage:

1. Load jQuery library and the jQuery POP'n SocialButton plugin on your webpage.

<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="js/jquery.popn-socialbutton.js"></script>

2. Create an empty container to place the social share widget.

<div class="social-button demo"></div>

3. Call the plugin on the container and specify an array of social networking services you wish to use.

// $('SELECTOR').popnSocialButton(SERVICES, OPTIONS);
$('.social-button.demo').popnSocialButton([ 'twitter', 'facebook', 'gplus' ], {
  url: 'https://www.jqueryscript.net/'
});

4. Available options.

url: document.location.href,
githubRepo: null,
feedUrl: null,
text: $('title').html(),
imgDir: './img',
buttonSpace: 24,
countPosition: {
  top: 32,
  right: -12
},
countColor: {
  text: '#ffffff',
  bg: '#cc0000',
  textHover: '#ffffff',
  bgHover: '#ff6666',
  border: '#ffffff'
},
countSize: 11,
popupWindow: {
  width: 640,
  height: 480
}

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