jQuery Plugin To Generate Custom Social Share Links

File Size: 48.3 KB
Views Total: 3526
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Generate Custom Social Share Links

Yet another jQuery plugin that lets you create custom social share links (buttons) to prompt your webpages in popular social networking sites.

Supported social networks:

  • Twitter
  • Facebook
  • Google+
  • Reddit
  • Pinterest
  • Linkedin

How to use it:

1. Download and include the jQuery Simple Social Share plugin's script after jQuery library.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jquery.simpleSocialShare.min.js"></script>

2. Initialize the plugin and we're ready to go.

$('.share-button').simpleSocialShare();

3. Create the social share links and specify the content you want to share using the data attributes like this:

<a class="share-button" data-share-url="https://www.jqueryscript.net" data-share-network="twitter" data-share-text="Share this awesome link on Twitter" data-share-title="Twitter Share" data-share-via="" data-share-tags="" data-share-media="" href="#">Share on Twitter</a>

<a class="share-button" data-share-url="https://www.jqueryscript.net" data-share-network="facebook" data-share-text="Share this awesome link on Facebook" data-share-title="Facebook Share" data-share-via="" data-share-tags="" data-share-media="" href="#">Share on Facebook</a>

<a class="share-button" data-share-url="https://www.jqueryscript.net" data-share-network="linkedin" data-share-text="Share this awesome link on LinkedIn" data-share-title="LinkedIn Share" data-share-via="" data-share-tags="" data-share-media="" href="#">Share on LinkedIn</a>

<a class="share-button" data-share-url="https://www.jqueryscript.net" data-share-network="googleplus" data-share-text="Share this awesome link on Google+" data-share-title="Google+ Share" data-share-via="" data-share-tags="" data-share-media="" href="#">Share on Google+</a>

<a class="share-button" data-share-url="https://www.jqueryscript.net" data-share-network="pinterest" data-share-text="Share this awesome link on Pinterest" data-share-title="Pinterest Share" data-share-via="" data-share-tags="" data-share-media="" href="#">Share on Pinterest</a>

<a class="share-button" data-share-url="https://www.jqueryscript.net" data-share-network="reddit" data-share-text="Share this awesome link on Reddit" data-share-title="Reddit Share" data-share-via="" data-share-tags="" data-share-media="" href="#">Share on Reddit</a>

Change Log:

2016-11-24

  • Added destroy option
  • Added logging instead of trowing an error when it makes more sense
  • Updated from codekit 2 to 3 for compiling
  • Updated to jquery 3.1.1 in demo

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