2022.12.28
2023.06.07
HubSpotにはWebサイトに訪れた人の行動や流入経路などのデータを収集し、分析できる機能があります。
HubSpotで作成したサイトであればデータを自動で集めてくれますが、他のCMS（Webページを生成・管理するシステム）で作成したページの場合はトラッキングコードの設置が必要です。
そこで本記事ではHubSpotのトラッキングコードをインストールする方法や設置するときの注意点を解説します。
ぜひ、この記事を参考にHubSpotのトラッキングコードをサイトに導入し、アクセス解析できる環境を整えましょう。
HubSpotの使い方、活用方法が聞ける、無料のオンライン相談会を開催中です。
「HubSpotで何ができるか知りたい方」はもちろん、「すでに利用しているがもっとフル活用したい方」もお気軽にご相談ください。
詳細は「HubSpotをより活用したい方へ！無料のオンライン相談会を実施中！」をご確認ください。
▼ 今すぐHubSpot無料相談会を予約
コンテンツ目次
トラッキングコードとは
トラッキングコードとは、Webサイトに訪れたユーザーの流入経路や行動履歴を追跡し、記録するための専用コードのことです。
収集した情報には、以下のようなものが含まれます。
- ユーザーがサイト内のどこを閲覧しているか
- どのページでコンバージョンしているか
- どこで離脱しているか
このように、ユーザーの行動データは、サイト運営の方向性を検討したり、内容を改善したりするために重要な情報です。
したがって、サイト運営を成功に導くには、トラッキングコードの設置とデータ収集・分析が必須です。
HubSpotには専用のトラッキングコードが設定されており、Webサイトに設置することで情報を収集・蓄積してくれます。さらに、アナリティクス機能を利用した分析も可能です。
HubSpotのトラッキングコードをWebサイトにインストールする方法
トラッキングコードを設置する手順は以下の3ステップです。
- HubSpotのトラッキングコードをコピーする
- トラッキングコードをWebサイトにインストールする
- トラッキングコードが正しく実行されているか確認する
なお、HubSpotで作成したページは自動でトラッキングされるので、コードを設置する必要はありません。
HubSpotのトラッキングコードをコピーする
まずはHubSpotのトラッキングコードをコピーしましょう。
手順を順番に解説していきます。
トラッキングコード表示画面に移動する
HubSpotのメインページから右上の[設定アイコン]＞[トラッキングとアナリティクス]＞[トラッキングコード]と進み、トラッキングコードの画面に移動してください。
トラッキングコードをコピーする
埋め込みコードが表示されている下側にある[コピー]をクリックするとトラッキングコードをコピーできます。
他のチームメンバーにコードのインストールを依頼する場合は、[ウェブ開発者にEメールを送信]をクリックしてメールを送ります。
トラッキングコードをWebサイトにインストールする
コピーしたトラッキングコードを、WebサイトのHTMLコード内にある</body>タグの前に貼り付けてください。
多くのCMSではフッターファイルにコードを貼り付けることで、全部のページにトラッキングコードを反映できます。
ここでは、WordPressとShopifyでトラッキングコードをインストールする方法を解説します。
WordPressにコードをインストールする
WordPressの場合、以下のプラグインをインストールし、有効化することで自動的にトラッキングコードをインストールできます。
- HubSpot All-in-One Marketing – Forms
- Pop-ups
- Live Chat WordPress
HubSpotではプラグインを利用することが強く推奨されています。
どうしてもプラグインを利用できない場合のみ、以下の手順でコードをインストールしてください。
- WordPressアカウントにログイン
- 左のメニューで[外観]＞[テーマファイルエディター]をクリック
- エディターの横に表示されるリストから[footer.php]を選択
- 表示されたテキストをすべてコピーし、別のファイルに保存することでバックアップを取る
- トラッキングコードを貼り付けて[ファイルを更新]を選択
これでWordPressのトラッキング情報をHubSpotで収集できるようになりました。
導入して終わりではなく、データを分析してサイト運営に活かしていきましょう。
Shopifyにコードをインストールする
Shopifyの場合は以下の手順でコードをインストールします。
- Shopifyにログインし、管理画面を開く
- 左のサイドバーで[オンラインストア]＞[テーマ]を選択
- テーマの[…]＞[複製]をクリックしてバックアップコピーを取る
- [アクション]をクリックして表示されるドロップダウンメニューから[コードを編集]を選択
- theme.liquidファイルを選択
- </body>タグの直前にHubSpotのトラッキングコードを貼り付け
- [保存]をクリック
これでShopifyのネットショップ上での顧客の行動を収集できます。
データを分析し、Shopifyでの成約率を高めていきましょう。
トラッキングコードが正しく実行されているか確認する
トラッキングが正しく実行されているか調べる方法は2つあります。
それぞれ詳しく見ていきましょう。
Webサイトのコードを確認する
1つ目はWebサイトのコードを直接チェックする方法です。
以下の手順で確認していきます。
- HubSpotのメインページ右上にある自分のアカウントをクリック
- 名前やメールアドレスの下に記載してある7桁ほどの数字である「Hub ID」をコピー
- トラッキングコードを貼り付けたウェブサイトを開く
- ウェブサイトの任意の位置で右クリックして[ページのソースを表示]を選択。Windowsの場合は「Ctrl+U」、Macの場合「Command+Option+U」のショートカットキーでソースコードを確認できる。
- Windowsなら「Ctrl+F」、Macの場合「Command+F」を押して表示されるボックスに「Hub ID」を入力して検索する
IDを含んだコードとコピーしたトラッキングコードが一致しており、</body>タグの前に設置されていれば、正常にインストールされています。
HubSpotのアクセス計測画面を確認する
2つ目はHubSpotのアナリティクスで流入経路やアクセス数が表示されているかをチェックする方法です。
以下の手順で確認していきます。
- HubSpotのメインページ左上にある[レポート]＞[アナリティクスツール]をクリック
- [トラフィックアナリティクス]をクリック
- セッション数を取得できているか確認
トラッキングコードを設置する前のデータは取得できない点には注意してください。
したがって、トラフィックが収集できているかを確認するのは、設置した翌日以降にしましょう。
Googleタグマネージャーを使用してトラッキングコードをインストールする方法
Googleタグマネージャーは、ソースコードを編集することなくトラッキングコードを追加できるツールです。
なお、Googleタグマネージャーではソースコードはタグと呼ばれています。
Googleタグマネージャーを使用したHubSpotトラッキングコードのインストール手順を解説していきます。
トラッキングコードをコピーする
HubSpotのメインページから右上の[設定アイコン]＞[トラッキングとアナリティクス]＞[トラッキングコード]をクリックします。
表示されたトラッキングコードの画面でタグをコピーしてください。
Googleタグマネージャーを新しいウィンドウで開く
新しいウィンドウでGoogleタグマネージャーを開き、ログインします。アカウントがある場合は、歯車マークの[設定アイコン]をクリックしてください。
アカウントがないのであれば、[アカウントを作成]をクリックして設定してください。
新規タグ作成画面を開く
[ワークスペース]＞[タグ]＞[新規]の順にクリックして新規のタグを作成する画面を開いてください。
タグの設定をする
表示されるウィンドウで「タグの設定」の上にマウスのカーソルを合わせると表示される[編集ボタン]をクリックしてください。
カスタムHTMLを選択する
右側に表示されるパネルから[カスタムHTML]を選択します。
HubSpotのトラッキングコードを貼り付ける
表示された画面のテキストボックスに、最初にコピーしたタグを貼り付けます。
トリガーの設定画面を開く
トリガーの右上に表示されている[編集ボタン]をクリックして設定画面を開きます。
トリガーを設定しないとタグは作動しません。データを収集するために必ず設定してください。
トリガーを選択する
HubSpotでは、すべてのページでタグを作動させることを推奨しています。
したがって、基本的には[All Pages]を選択してください。
ウェブサイトにGoogleタグマネージャーをインストールする
情報を収集するウェブサイトにGoogleタグマネージャーをインストールしてください。
管理画面を開く
[Googleタグマネージャーをインストール]をクリックし、Googleタグマネージャーの管理画面を開いてください。
コードを指定の位置に貼り付ける
表示されたパネルに従いコードをコピーし、ウェブサイトに貼り付けてください。
HubSpotのトラッキングコードをインストールする際の注意点
HubSpotでは複数のトラッキングコードを1つのページにインストールできない点に注意してください。
複数のコードが貼られている場合、最初のコードを読み込んだ後、残りは読み込まれません。
HubSpotのトラッキングコードをサイトに設置してアクセス解析をしよう
HubSpot以外で作成したWebサイトのトラフィックを収集するにはトラッキングコードの設置が必要です。
設置方法は利用しているCMSにより異なります。また、Googleタグマネージャーを利用してWebサイトに設置することも可能です。
ぜひ、この記事を参考にトラッキングコードを設置し、HubSpotのアナリティクス機能でWebページをより良いものに改善していきましょう。
なお、FLUEDではHubSpotを最大限に活用していただくための無料の相談会を実施しています。
以下のリンクから詳細を確認してみてください。
HubSpotの使い方、活用方法が聞ける、無料のオンライン相談会を開催中です。
「HubSpotで何ができるか知りたい方」はもちろん、「すでに利用しているがもっとフル活用したい方」もお気軽にご相談ください。
詳細は「HubSpotをより活用したい方へ！無料のオンライン相談会を実施中！」をご確認ください。
▼ 今すぐHubSpot無料相談会を予約
