IMP-SDK documentation

developed by Timmy Luong

// Fast way, default modal styles:
var options = {
  name: 'Michael Kors Charm Mixer',
  description: 'From classic letters to playful pompoms, easily update your Michael Kors handbag!',
  picture: 'http://secure-netstorage.macys.com/social/image-upload/michael-kors-mixer-300x300.png',
  link: 'http://www.macys.com/campaign/social?campaign_id=620&channel_id=1&bundle_entryPath=/mixer/1',
};

var callback = function(error) {
  window.console.log(error);
};

ImpSdk.social.showSharePopup(options, {}, 'my-share-popup-element-id', callback);

/*---------------------------------------------------------------------------*/

// If you want customized styles:
// - make an object for the customized styles
// - call the function with the customized styles object:

var customStyles = {
  overlay: {
    position: 'fixed',
    top: 0,
    left: 0,
    right: 0,
    bottom: 0,
    backgroundColor: 'rgba(0, 0, 0, 0.3)',
    zIndex: 9999,
  },
  content: {
    position: 'fixed',
    margin: 'none',
    top: '0px',
    left: '0px',
    right: '0px',
    bottom: '0px',
    border: '10px solid black',
    overflow: 'auto',
    padding: '8px',
    width: '292px',
    height: '240px',
    backgroundColor: 'white',
  },
};

ImpSdk.social.showSharePopup(options, customStyles, 'my-share-popup-element-id', callback);

*To remove CSS used only by the docs, the example component is in a separate page

Note: In Firefox, the pop-up generated by Facebook will not render the message box if the description is too short. The minimum length is a certain pixel value that is roughly equivalent to 46 characters long (depending on the width of the characters). This issue affects only Firefox. The exact same description will render properly on Chrome.

ImpSdk.social.showSharePopup(`options`, `styles`, `target`, `callback`)

Parameter	Type	Description
`options`	Object	The properties for the social platforms. See the individual social platforms for details of the properties. The options passed in here must be the aggregate of all properties required by every social platform.
`styles`	Object	By default the styles are set. To use the default modal styles, pass in {} which is an empty object. To use custom styles, pass in a customized styles object. See more details at the modal styling page.
`target`	String	The element's id attribute. Note: showSharePopup requires its own empty element tag with an id attribute set to `target`. When you create your button or widget, please ensure that showSharePopup's target is its own empty element such as a div or a span. *Optional* Advanced Usage: The empty element holding our target id may be reused for multiple sharePopopup components. The modal component itself is not tied to any button or icon image. The modal component is invisible on the page when in a closed state. For example: we have an empty <div id="my-show-share-popup"></div>. We can then make many buttons with the share popup functionality at different places on the page. All of the buttons can reference this same target div's id when setting their click handlers to call showSharePopup().
`callback`	Function	The required callback function passed down to social sharing functions (facebook, twitter, etc) for error handling.

ImpSdk.social.showSharePopup

developed by Timmy Luong

ImpSdk.social.showSharePopup(options, styles, target, callback)

ImpSdk.social.showSharePopup(`options`, `styles`, `target`, `callback`)