v4 Floating Sharing Tool

This guide is designed to help you setup the Floating Share button tool that sticks to the side, bottom, or top of the window and maintain it's position as a user scrolls.

This tool can be enabled through the constructor in the Social Tools tab of your dashboard or through the use of our Global Configuration Variable.

View Example

Global Configuration Variable

To use a floating widget with the default settings you can set sticky:true

 var pwidget_config={
     sticky:true
}

Options

To customize the way your floating tool looks you can add in the following options. The configuration shown below will create a floating share bar that spans the width of the screen using the default buttons, and is always visible at the bottom.

 var pwidget_config = {
     sticky : {
          position : 'bottom',
          widgetOptions : {
               view: 'full'
          }
     }
}

Key

Default Value

Possible Values

Description

position

'left'

'left'	'right'	'top'	'bottom'
'top-right'	'top-left'	'bottom-right'	'bottom-left'

left – screen left corner in the center
right - screen right corner in the center
top - screen upper side in the center (if view="full" for whole screen width widget)
bottom - screen lower side in the center (if view="full" for whole screen width widget)
top-left – screen top-left corner
top-right - screen top-right corner
bottom-left - screen bottom-left corner
bottom-right - screen bottom-right corner

offset

See description item 1.

1. Array(x,y)
or
2. Function

Ability to set an offset from widget display point

(1) Default values for sides

Position

Default Value

'left'

'right'

[0;0]

'top'

'bottom'

[0,0]

'top-right'	'top-left'
'bottom-right'	'bottom-left'

[0,0]

(2) Function for offset

?

pwidget_config:{

    sticky: {

        offset: function(element) { return [30, 10]; },

        position: 'top'

    };

}

toggleButton

true

true

false

object (see description for options)

If this parameter is set, there will be floating widget hide arrow

(1) use default values if toggleButton: true

Key Name	Default Value	Possible Values	Description
show	'always'	'always' 'hover'	always – arrow is always displayed  hover – arrow is displayed on widget hover

openOnInit

true

true

false

Hide/Show widget when the page is loading

widgetOptions

defaults values from widget's global config (section "defaults")

?

widgetOptions: {

   buttons: ['facebook', 'twitter', 'linkedin'],

   etc...

}

Any item in global config defaults section

all possible values that can be included in the widgetOptions object are available here in the defaults section.

For help with setup contact [e-mail].