# クリックイベントの拡張

## メタデータの追加 <a href="#add-metadata" id="add-metadata"></a>

計測対象要素に `data-wicle-click-additional` 属性を付与することで、任意のデータをクリックイベントに付与することができます。

```html
<a data-wicle-click-additional="string data">link</a>
```

属性を付与すると、クリックの追加情報(additional)フィールドに文字列データとして格納され、検索できるようになります。

<figure><img src="https://1516189518-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhDtk9aBzYOvC8RRWtKCd%2Fuploads%2FkO3WNJgF6t5Wgmwroo88%2Fimage.png?alt=media&#x26;token=d1d99d36-68ff-4aa3-96c5-824fd749ef7d" alt=""><figcaption></figcaption></figure>

## イベント発生対象の追加・除外 <a href="#target-setting" id="target-setting"></a>

### CSSセレクターで設定する

{% content-ref url="auto-event" %}
[auto-event](https://docs.wicle.io/data-setting/event-tracking/auto-event)
{% endcontent-ref %}

上記のクリック計測対象に合致しない要素を、CSSセレクターを指定し該当するDOMに対するクリックを計測対象として追加したり、逆に計測対象となっている要素を除外することができます。

[プロジェクト設定の計測タグ画面](https://app.wicle.io/settings/mesurement-tag)から設定することができます。

### data属性で設定する

任意のdata属性を指定し、該当するDOMに対するクリックを計測対象として追加・除外できます。

| 設定         | 説明                               |
| ---------- | -------------------------------- |
| 追加対象data属性 | 指定したdata属性を持つ要素のクリックを計測対象に追加します  |
| 除外対象data属性 | 指定したdata属性を持つ要素のクリックを計測対象から除外します |

すでに何らかのトラッキングツールでdata属性を付与している場合に活用できます。

[プロジェクト設定の計測タグ画面](https://app.wicle.io/settings/mesurement-tag)から設定できます。

### HTMLを修正し設定する

CSSセレクターでの指定が厳密にはできないケースや、修正で計測が行われなくなるケースなどが考えられる場合、対象とするHTMLタグに `data-wicle-auto-click` 属性を付与することでその要素のクリックイベントを送信対象とすることができます。

```html
<div data-wicle-auto-click></div>
```

## 確認方法

[event-viewer](https://docs.wicle.io/chrome-extension/event-viewer "mention") で、実装後の確認を行うことができます。