Social Sharing Buttons With jQuery Plugin - Social.js

Social Sharing Buttons With jQuery Plugin
jQuery Plugin To Add Social Sharing Buttons To Your Site - Social.js

Social Media is a great vehicle for driving traffic, but how do you make it easy for readers to share your content? You can make this process easier by adding a social sharing plugin.

Social.js is a small and easy to use jQuery plugin that allows you to easily create social media sharing buttons for popular social media sites right on your website or blog. This is a great way to increase your traffic, get more views and increase your subscriber count.

How to use it

1. Download and load the socialSharing.js script after jQuery.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/socialSharing.js"></script>

2. Load the latest Font Awesome Iconic Font for social icons.

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

3. Create an empty DIV container to hold the social sharing buttons.

<div id="demo"></div>

4. Initialize the plugin to generate social sharing buttons on the page. Available social media networks:


  // URL to share
  url: window.location.href,

  // get description from meta description tag
  description: $('meta[name=description]').attr('content'),

  // get title from title tag
  title: $('title').text(),

  enable: ['copy', 'facebook', 'twitter', 'pinterest', 'linkedin', 'reddit', 'stumbleupon', 'pocket', 'email', 'whatsapp']

5. Available options to customize the social sharing buttons.


  // url to share
  url: '',

  // page title
  title: '',

  // page description
  description: '',

  // image to share
  img: $('meta[property="og:image"]').attr('content'),

  // button classes
  btnClass: 'btn btn-light',

  // Array of social sharing links
  // ['copy', 'facebook', 'twitter', 'pinterest', 'linkedin', 'reddit', 'stumbleupon', 'pocket', 'email', 'whatsapp']
  enable: null,

  // enable responsive class
  responsive: false,
  // 'left' or 'right'
  mobilePosition: 'left',

  // copy message
  copyMessage: 'Copy to clipboard',


Live Demo

See the Pen Social Sharing Buttons With jQuery Plugin - Social.js by Teguh Sigit (@teguhsigit) on CodePen.

File Info

File Name :
Size :
Site Download :
Official Website:
Previous Post Next Post