Floating Social Share Bar In Pure JavaScript – Sharerbox

Preview:

Description:

Sharerbox is an easy-to-use yet fully configurable floating (sticky) social share bar that can be placed either on the left or on the right side of the screen.

How to use it:

1. Download and insert the main JavaScript sharerbox.js into the document.

<script src="sharerbox.js"></script>

2. Add social networks to the social share bar. Supported social networks:

• Twitter
• Facebook
• WhatsApp
• LinkedIn
• Reddit
• Tumblr
• Pinterest
• Telegram
• Email
• Direct Link

sharerboxIcons('facebook twitter whatsapp pinterest linkedin reddit tumblr telegram');

3. Set the icon size in pixels (24-100).

sharerboxIcons('facebook twitter whatsapp pinterest linkedin reddit tumblr telegram', 32);

4. Initialize the sharerbox and done.

sharerSetup();

4. Possible parameters to config the floating social share bar.

• behavior: open the social share page in a popup or in a new tab
• position: determine the position of the floating social share bar, ‘left’ or ‘rignt’
• color: the color of the toggle button
• visibility: hide the floating social bar or not
• shareDescription: define your own message or website description here

sharerSetup(behavior = 'popup', position = 'right', color = 'black', visibility = 'hidden', shareDescription = '')

Changelog:

v0.8.1 (10/31/2021)

• Bugfix

v0.8.0 (04/22/2021)

• Added support for the Web Share API from mobile devices
• Social media button sizes are now customizable
• Bugfix

v0.7.1 (04/17/2021)

• SharerBox no longer obstructs selection of page elements displayed under SharerBox’s non-visible external container element