
An easy yet customizable jQuery based floating social share bar positioned at the left or right of the page to maximize your social media visibility.
Supported social networking services:
- Google+
- Tumblr
- StumbleUpon
- Digg
More features:
- Custom width/height of social share popup.
- Custom page title, description, and URL to share.
- Subtle animation on hover.
- Circular and square social icons.
How to use it:
1. Include the necessary Font Awesome for social icons.
<script src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
2. Include jQuery library and the jQuery social-share-bar.js plugin's files on the page.
<link href="css/jquery-social-share-bar.css" rel="stylesheet"> <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" crossorigin="anonymous"> </script> <script src="js/jquery-social-share-bar.js"></script>
3. Create an empty container to place the floating social bar.
<div id="share-bar"></div>
4. Call the function on the DIV container and done.
$('#share-bar').share();
5. Customize the floating social share bar.
$('#share-bar').share({ // page title pageTitle: '', // page url pageUrl: window.location.href, // page description pageDesc: '', // or 'right' position: 'left', // or 'square' theme: 'circle', // enable/disable animation animate: true, // popup width popupWidth: 640, // popup height popupHeight: 528, // an array of social networking services channels: ['facebook', 'twitter', 'linkedin', 'googleplus', 'email'], // trigger class itemTriggerClass: 'js-share' });
This awesome jQuery plugin is developed by Viima. For more Advanced Usages, please check the demo page or visit the official website.
- Publication date: 09.02.2018
- Source