What should you do if you want to install a counter like the one shown here directly on your site?

Step 1: Copy the counter

The counter is sent to you as a zip file which, unzipped, essentially contains three objects:

• A file index.html as a template
• A folder with css code
• A folder with javascript-Code

 

 

Copy these files and folders into the folder containing your html file in which the counter is to be included.

Step 2: Complete the header of your html file

In the template index.html you will find some code in the header, similar to the one here, which you can copy/paste to the header of your html page:

<link href=/counter/css/app.87a80049.css rel=preload as=style>
<link href=/counter/css/chunk-vendors.d2d2fbbd.css rel=preload as=style>
<link href=/counter/js/app.61df2aba.js rel=preload as=script>
<link href=/counter/js/chunk-vendors.1966293c.js rel=preload as=script>
<link href=/counter/css/chunk-vendors.d2d2fbbd.css rel=stylesheet>
<link href=/counter/css/app.87a80049.css rel=stylesheet>

Step 3: Put the counter in the right place

In the template you will also find a piece of code similar to this one. Build this directly into the body of your html page:

<div id=app></div>
<script src=js/chunk-vendors.20ab2e68.js></script>
<script src=js/app.bd52dba8.js></script>

Step 4: Set up the counter

You will find sample counters on our website, e.g. the CO2-Counter Start with a sample and make all changes in the settings until the counter looks and works the way you want it to be on your website.

Step 5: Copy the settings

Under "Share Your counter" in the settings you will not only find a link for direct access, but a line of text that contains all settings in JSON format. You can download these settings as a file.

 

 

Step 6: Place the settings on your website

Save this file with the name "widget-config.json" into the folder in which you pasted the data from step 1.

Privacy / Technical / Security

Our counter is made with vue.js, that is a javascript frontend framework. To avoid any kind of data privacy or security issues this code runs on the device of the site visitor only. There is no "backend" and no user account at all and no data are transferred anywhere and no cookies used.