Essity Hotspots 1.0.14

An interactive hotspot component for Baby retailer sites.

Installation

NPM

npm install essity-hotspot --save

import 'essity-hotspot/dist/main.css'
import { initialize } from 'essity-hotspot'

initialize()

The package will attach to any element with the data-hotspot-configuration-id attribute, e.g.

<div data-hotspot-configuration-id="1066">
<!-- hotspot component for RnB PD will appear here -->
</div>

If an element is dynamically added to the DOM, you can use the initialize(settings, element) overload to pass the target element:

initialize({
    hotspotConfigurationId: '1066'
}, document.getElementById('hotspot-component'))

Direct download

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/essity-hotspot/dist/main.min.css">
<script src="https://cdn.jsdelivr.net/npm/essity-hotspot/dist/index.js"></script>

The library will be exposed (in a UMD compatible manner) on the global namespace usingwindow.essityHotspots:

essityHotspots.initialize(/* optional settings */)

Parameters

Currently, there are 16 configuration setups available:

They are available in the following languages using the culture parameter:

English: en-US
Nederlands: nl-NL
Deutsch: de-DE
Français: fr-FR

If you omit the parameter, en-US will be used as default.