facebook twitter

Ask your users anything

Get to know your users' needs and inner thoughts about you and your product, with this simple widget.

Widget documentation

Available JavaScript methods for extra control.

<script type="text/javascript">
  var _plr = [],
    baseUrl = 'https://pollr.net';
  _plr.push(['id', '123456789abcdef']);
  _plr.push(['baseUrl', baseUrl]);
  _plr.push(['apiVersion', 1]);

  (function() {
    var p = document.createElement('script'); p.type = 'text/javascript'; p.async = true;
    p.src = baseUrl + '/assets/widget.min.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(p, s);
  })();
</script>

Installation

Place this script on your website.

  • Additional options can be added with
    _plr.push(['key', 'value'])
  • The widget adds a global variable for accessing the API with
    window.POLLR

Set callback.

_plr.push(['onOpen', function(api, state) { /* Do something */ }]);

Or set the callback programatically.

window.POLLR.api.widget.setCallback('onClose', function(api, state) { /* Do something */ });

Available callbacks

  • onInitialize
    runs once when the widget installs successfully.
  • onRender
    runs once when the widget renders the first time successfully.
  • onOpen
    runs every time you open the widget.
  • onClose
    runs every time you close the widget.
  • onMinimize
    runs every time you minimize the widget.
  • onMaximize
    runs every time you maximize the widget.
  • onAnswered
    runs when a user has completed answering the questions.
_plr.push(['...', function(api, state) {}]);

API is same as

window.POLLR.api

The state object

{ done: true, visible: true, minimized: true, answered: true }

Callback function declarations

All callbacks get access to the api and the state object.

  • done
    true if the widget was installed successfully. false if there was a problem.
  • visible
    true if the widget is visible. false if it isn't.
  • minimized
    true if it is minimized. false if maximized.
  • answered
    true if a user has completed answering the questions.
<html class="pollr-widget--visible ... ...">

Example

.pollr-widget--visible .another-element {
  display: none;
}

Helper classes

The widget adds a few CSS classes to your html tag. These can help you style certain parts of your website when the widget is visible.

  • pollr-widget--visible
    added when the widget installs successfully.
  • pollr-widget--minimized
    added when the widget is minimized.
  • pollr-widget--maximized
    added when the widget is maximized.
window.POLLR.api.widget.run();
window.POLLR.api.widget.show();
window.POLLR.api.widget.close();
window.POLLR.api.widget.minimize();
window.POLLR.api.widget.maximize();

Widget controls

Control the widget programatically.

  • run
    initializes and shows the widget. Useful when the autoRun setting is off.
  • show
    shows the widget.
  • close
    closes the widget.
  • minimize
    minimizes the widget.
  • maximize
    maximizes the widget.

Run widget on first page load.

_plr.push(['onInitialize', function(api, state) { api.widget.run(); }]);

Turbolinks example

document.addEventListener('turbolinks:load', function() {
  POLLR.api.widget.run();
});

Single page apps

Initialize the widget in single page apps, that might replace the whole body tag.

  • Make sure to run
    POLLR.api.widget.run();
    on the first page load.
  • Then run
    POLLR.api.widget.run();
    again after every page change. This will differ depending on your framework.
  • Sometimes you might need to check if the widget has finished initializing before using the widget's API. You can check that by using
    if (typeof POLLR !== 'undefined') { // Some code }
    .