Skip to content

Installation

The Basic Script

The most basic installation is just to add a simple JavaScript code. This code can be added anywhere in the page's JavaScript or in the HTML of the site when wrapped inside a script element. It is recommended to be inserted in the bottom of the page as not to affect the performance of the page. YOUR-LOCATION must be replaced with the location text provided by Neuvola.com.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
(function(w, d, s) {
    w.NeuvolaInit = function(n) {
        w.Neuvola = new n({
            url: "https://covid.neuvola.com/YOUR-LOCATION"
        }, d);
        w.Neuvola.init();
    };
    var h = d.getElementsByTagName(s)[0],
        j = d.createElement(s);
    j.async = true;
    j.src = 'https://js.neuvola.com/widget/v1.js';
    h.parentNode.insertBefore(j, h);
})(window, document, 'script');

Inside The HTML

When adding inside the HTML and not inside JavaScript, the script must be wrapped inside a script (replace HERE with the script):

1
<script type="text/javascript"> HERE </script>

Configuration

The widged can be configured inside the initialization script.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
(function(w, d, s) {
    w.NeuvolaInit = function(n) {
        w.Neuvola = new n({
            debug: true,
            language: "fi",
            url: "https://covid.neuvola.com/YOUR-LOCATION",
            text: "COVID-19 chat",
            position: "left",
            size: "small",
            zindex: 1000000,
            color: "#FFFFFF",
            background: "#25638A"
        }, d);
        w.Neuvola.init();
    };
    var h = d.getElementsByTagName(s)[0],
        j = d.createElement(s);
    j.async = true;
    j.src = 'https://js.neuvola.com/widget/v1.js';
    h.parentNode.insertBefore(j, h);
})(window, document, 'script');

Configuration Options

These configuration options can be changed in the JavaScript initialization code. It is also possible to fill these options dynamically based on the use case of the website. For example, the language can be set according to the language of the page.

1
2
3
4
5
6
7
8
9
debug: true # If true, the widget will output debugging information into the JavaScript console. Defaults to false.
language: "en" # Default language using ISO-639-1 (uses a 2-letter language code) such as en for English. Defaults to the one set remotely in the location.
url: "https://covid.neuvola.com/YOUR-LOCATION" # Contains the full location url for ythe used bot. Mandatory.
text: "Open Chat" # Text shown on the chat button. Defaults to "COVID-19 chat".
position: "right" # Position of the chat button. "left" or "right". Defaults to "right".
size: "small" # Size of the chat button. "small", "medium" or "large". Defaults to "small".
zindex: 1000000 # Layer z-index of the widget that allows it to be set under or on top of other elements. Defaults to 1000000.
color: "#FFFFFF" # Text color of the chat button. Defaults to "#FFFFFF".
background: "#25638A" # Background color of the chat button. Defaults to "#25638A".