https://github.com/inventage/matomo-opt-out

A web component to let visitors opt-out of Matomo tracking
https://github.com/inventage/matomo-opt-out

analytics lit-element lit-html matomo matomo-tracking opt-out tracking visitors-opt web-components

Last synced: 3 months ago
JSON representation

A web component to let visitors opt-out of Matomo tracking

• Host: GitHub
• URL: https://github.com/inventage/matomo-opt-out
• Owner: inventage
• License: mit
• Created: 2020-04-07T12:59:39.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2023-11-01T13:35:25.000Z (over 1 year ago)
• Last Synced: 2025-03-09T22:38:05.371Z (3 months ago)
• Topics: analytics, lit-element, lit-html, matomo, matomo-tracking, opt-out, tracking, visitors-opt, web-components
• Language: JavaScript
• Homepage: https://glitch.com/~inventage-matomo-opt-out
• Size: 1.26 MB
• Stars: 1
• Watchers: 4
• Forks: 0
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# \

A web component to let visitors opt-out of Matomo tracking.

[![made with open-wc](https://img.shields.io/badge/made%20with-open--wc-%23217ff9?style=flat-square)](https://open-wc.org)

[![Build](https://img.shields.io/github/workflow/status/inventage/matomo-opt-out/Node.js%20CI?style=flat-square)](https://github.com/inventage/matomo-opt-out/actions?query=workflow%3A"Node.js%20CI")

[![Published on npm](https://img.shields.io/npm/v/@inventage/matomo-opt-out?style=flat-square)](https://www.npmjs.com/package/@inventage/matomo-opt-out)

## Dependencies

Your Matomo installation will have to have the [Ajax Opt Out] plugin enabled.

## Usage

```js

import '@inventage/matomo-opt-out';

```

```html

```

### Note on browser compatibility & transformation

Currently, the recommended way to publish a web component using [open-wc] is to publish the ES6/7 source code as is. 

Since your application knows best about which browsers to support and how to transform the source code (if at all)

for those browsers, you will have to take care of any transformations yourself.

### Properties

| Property        | Attribute         | Type      | Default                                                  |

| --------------- | ----------------- | --------- | -------------------------------------------------------- |

| `isBusy`        |                   | `boolean` | false                                                    |

| `isTracked`     |                   | `boolean` | false                                                    |

| `matomoUrl`     | `matomo-url`      | `string`  |                                                          |

| `optedInLabel`  | `opted-in-label`  | `string`  | "You are not opted out. Uncheck this box to opt-out."    |

| `optedOutLabel` | `opted-out-label` | `string`  | "You are currently opted out. Check this box to opt-in." |

## Development

- Create a copy of `local.config-example.js` and name it `local.config.js`

- Add the URL to your Matomo installation

- Run `$ npm start`

- Navigate to http://localhost:8000/demo/

[ajax opt out]: https://plugins.matomo.org/AjaxOptOut

[lit-element]: https://lit-element.polymer-project.org/

[lit-html]: https://lit-html.polymer-project.org/

[open-wc]: https://open-wc.org