ゴールの新規作成：セレクタのコードをウェブページから取得する

ゴールの「通常作成」で設定する、「ゴール達成までのステップ」で指定する要素のセレクタのコードを、Google Chrome のデベロッパーツールで取得できます。

1. 指定するページを Google Chrome で開く

ゴールの「通常作成」で設定する「ゴール達成までのステップ」で指定するページを開きます。

例として、弊社のコーポレートサイトの画面右上の［お問い合わせ］ボタンのセレクタを選択して、ゴールのステップの達成条件を「指定した要素をクリックする」の要素に指定します。

2. デベロッパーツールを開く

① ページ上で右クリックして、コンテキストメニューを開きます。

② コンテキストメニューから［検証］を選択します。

3. デベロッパーツールでページのソースコードを確認する

デベロッパーツールでページのソースコードを確認します。ソースコードが表示されないときは［Elements］タブをクリックします。

4. 目的の要素のソースコードを選択する

①［］ボタンをクリックします。

② 指定したい要素を「ページ上」でクリックします。

③ クリックした要素に該当する文字列が「ソースコード上」でフォーカスされます。

5. 目的の要素のセレクタをコピーする

① フォーカスされたソースコード上で右クリックして、コンテキストメニューを開きます。

② コンテキストメニューから［Copy］-［Copy Selecter］を選択します。

6.［要素の指定］入力フィールドにペーストする

① コピーした文字列

#index > section > header > ul > li.header__nav--contact > a

を以下の形式で

$("#index > section > header > ul > li.header__nav--contact > a")

［要素の指定］入力フィールドにペーストします。

②［作成］ボタンをクリックしてゴールの作成を完了すると「www.glad-cube.com」ドメインのヘッダーが表示されるすべてのページの［お問い合わせ］ボタンのクリックをコンバージョンとして計測します。