Shopifyでのサーバーサイドタグ付け

Ivanna Holubovska

Ivanna Holubovska

名前
更新された
2026/06/12
コメント
以下の言語でも利用可能

Shopifyサーバーサイドタグ付けの簡単で速い設定方法をお探しですか?Shopify向けのStape Conversion Trackingアプリが最適です。当社のアプリを使用すれば、ウェブサイトの各ページにWeb Google Tag Managerスクリプトを簡単に挿入し、カスタムドメインとカスタムローダーを設定し、ユーザーとeコマースイベントデータをデータレイヤーに送信し、Webhooksを設定することができます。これらの機能により、Cookieの寿命を延長し、追跡防止技術に対するブラウザ追跡を耐性を持たせ、サーバーエンドポイントを通じて広告およびマーケティングプラットフォームに信頼できるデータを送信することで、追跡の精度を高めることができます。

このブログ記事では、これらの強力な機能をすぐに使用できるように、Shopify向けのStapeアプリをどのように構成しインストールするかを探ります。

Shopify向けサーバーサイドタグ付けの利点

サーバーサイドタグ付けは、正確なコンバージョン追跡とユーザー分析により、マーケティングキャンペーンの成功を大幅に向上させることができます。しかし、これを最大限に活用するためには、細心の設定が必要です。

サーバーサイドタグ付けの実装をできるだけ簡単にするために、私たちはConversion Tracking Shopifyアプリを作成しました。このアプリは無料で使用でき、Shopifyストア向けのサーバーGoogle Tag Managerコンテナの設定を容易にします。しかし、まずShopifyサイト向けのサーバーサイドタグ付けの主な利点について話しましょう。

1. データ精度の向上。サーバーサイドタグ付けは、広告ブロッカー、ブラウザ拡張機能、またはその他のクライアントサイド要因によって引き起こされるデータ損失やエラーのリスクを減らすことで、より正確なデータ収集を保証するのに役立ちます。

2. 正確なコンバージョンの帰属。Cookieの寿命が延長され、ユーザーデータがサーバーを通じて送信されるため、広告ネットワークはマーケティングキャンペーンへのコンバージョンをより正確に帰属できます。

3. ウェブサイトパフォーマンスの向上。サーバーサイドタグ付けにより、タグはクライアントサイドではなくサーバー上でロードされるため、ユーザーのブラウザ上でロードする必要があるコードの量が減ります。これによりウェブサイトのローディング速度が向上し、これはユーザー体験とSEOにとって重要です。

4. セキュリティの向上。サーバーサイドタグ付けは、クライアントサイドの脆弱性によって引き起こされるデータ侵害やその他のセキュリティ脅威のリスクを減らすことで、ウェブサイトのセキュリティを向上させるのに役立ちます。

Shopifyストアでサーバーサイドタギングを設定する方法

手順1. Stape上でサーバーGoogle Tag Managerコンテナを設定してください。

詳細なガイドは、以下の折りたたみ要素を展開してご確認ください。

手順2. ShopifyのStape Conversion Trackingアプリを追加・設定する

2.1 ストアにStape Conversion Trackingアプリをインストールしてください

Shopify用Stape Conversion Trackingアプリは、Shopifyマーケットプレイスから無料でインストールできます。

Shopifyストア内のStape Conversion Trackingアプリ

2.2 Generalタブを設定する

Generalタブには、広告ブロッカーやITP、Cookie有効期限の制限に強い形でShopifyショップのすべてのページにGTMスニペットを追加するための設定がすべて含まれています。

[一般]タブの設定
  • Use Shopify Markets

複数のShopifyマーケットをお持ちの場合はこのチェックボックスにチェックを入れてください。この機能を使うと、ShopifyマーケットごとにGTMインジェクションを個別に設定できます。無効の場合、すべてのマーケットがデフォルト設定を使用します。

有効にすると、各マーケットで設定が必要なフィールドが表示されます。

  • Insert GTM:チェックを入れると、すべてのウェブサイトページにGTMスニペットが追加されます。
GTMのコンテナID
  • Customer privacy API:有効にすると、ShopifyのCustomer Privacyバナーを通じて訪問者がCookieに同意するまで、アプリがGTMの読み込みを保留します。このオプションはデフォルトでは推奨されません。
  • Custom domain、Stape container ID、Cookie Keeper:これらのフィールドはサーバーサイドトラッキングに関連しています。サーバーサイド設定を使用している場合や今後使用する予定がある場合は設定してください。各フィールドの値の見つけ方は以下で説明します。
GTM injection config
  • GTM web container ID

ここにウェブGTMコンテナIDを入力してください。

Web container ID in GTM
  • Custom domain

ファーストパーティCookieが正しく機能し、トラッキング全般が正常に動作するためには、独自のサブドメインを使用することが非常に重要です。まだsGTMコンテナにサブドメインを追加していない場合は、カスタムドメインに関するガイドに従ってください。

  • Custom Loader

広告ブロッカーへの対策を強化するために、使用を強くお勧めします。

対応するチェックボックスにチェックを入れ、Stapeコンテナ識別子を指定してください。確認するには、Stapeアカウントにログインし、sGTMコンテナを選択して、Settingsセクションでコンテナ識別子を確認してください。

「設定」セクションのコンテナ識別子
  • Cookie Keeper

この機能を使うと、最新のITP制限の影響を最小限に抑えることができます。アプリからこの機能を有効にする前に、Stapeのコンテナで有効になっていることを確認してください。Cookie Keeperを設定するには、折りたたみ要素をクリックして手順に従ってください。

  • GTM snippet block

ここでは、ShopifyテーマではないページにインストールするためのGTMスニペットを取得できます(Zipifyなどのサードパーティアプリが作成したページなど)。

2.3 Data Layerタブを設定する

Data Layerタブには、有効化・設定するデータレイヤーイベントが表示されます。2番目のボックスでは、GTMでの競合を防ぐためにイベント名に_stapeサフィックスを付けるかどうかを制御できます。オフにすると、イベントは通常の名前を保持します。

Data Layerタブ

データレイヤーの有効化:

  • Add ecommerce Data Layer eventsチェックボックスを有効にしてください。
  • 変更を保存してください。
  • Data Layerタブの下部のボックスにあるカスタムピクセル用のコードをコピーし、追加・有効化するための手順に従ってください。

Customer privacyセクションの権限スポイラーの下で、Not requiredを選択していることを確認してください。このコードスニペットはデータレイヤーを生成するだけであり、Cookieを設定したり、第三者にデータを送信したりすることはありません。

Data Layerタブには、開発者やストア管理者向けのデバッグオプションである**Log events to console (Dev)**もあります。有効にすると、eコマースイベントがブラウザコンソールに記録され、GTM/Stapeサーバーコンテナに送信されたイベントのペイロードが検証のために表示され、データレイヤーのデバッグに役立ちます。

このオプションは開発専用であり、不要なコンソールログを避けるため、本番環境では無効にしてください。

"Log events to console (Dev)"チェックボックス

2.4 Webhooksタブを設定する

WebhookイベントはWebhookタブで設定します。

注意: ShopifyのWebhookの問題点は、すべてのプラットフォームのトラッキングに不可欠なCookieデータが含まれていないことです。そのため、Webhookイベントの使用は、何らかの理由でオンラインでトラッキングできない場合の最後の手段としてのみ推奨されます。

このタブでWebhookイベントを設定します。

タブWebhook

Webhookを有効にするには、チェックボックスを有効にし、サーバーGTMコンテナのURLとWebhookの送信先となる/pathを指定してください。

新規注文が作成された時や注文の返金が行われた時にWebhookを受け取ることができます。

Webhookの使用とデバッグに関する参考記事:

2.5 Customer Matchタブ

Google Ads キャンペーンを実施していない場合やCustomer Matchリストを使用していない場合は、このタブの設定をスキップしてください。

手順3. サーバーGoogle Tag ManagerコンテナにデータをSendする

最も一般的な2つの方法は:

手順4. サーバーGoogle Tag Managerコンテナ内でトラッキングを設定する

主要なマーケティング・分析ツールのほとんどはすでにサーバーサイドタギングをサポートしており、sGTM用のタグを備えています。実装ガイドはサイトでご確認いただけます(例:Facebook CAPITikTok Events APISnapchat Conversions APIGoogle Adsサーバーサイドトラッキングなど)。

手順5. アプリの設定をテストする

GTMダウンロードのデバッグ

有効化または変更を行った後は、コンテナが実際にサイトにアップロードされているか確認することをお勧めします。

確認するには、サイトの任意のページに移動し、ブラウザコンソールを開いて、ネットワークタブでサブドメイン/タギングサーバーのURLでフィルタリングしてください。以下のスクリーンショットのように、レスポンスステータスが200のリクエストが表示されるはずです。

ブラウザコンソールの「ネットワーク」タブ

チェックアウトデータレイヤーイベントのデバッグ チェッ

クアウトページより前に発生するイベントについては、他のプラットフォームと同様にすべて機能します。ウェブGTMコンテナのプレビューを起動してすべてのイベントを確認できます。

Web GTM プレビューモードでのイベント

チェックアウトイベントはGTM Previewに表示されません。これは、これらのページの隔離された環境が、GTMスニペットを含む無制限のDOM操作やスクリプトインジェクションをブロックするためです。

ただし、Stape GTM Helper Chrome拡張機能を使ってチェックアウトページに手動でスニペットを挿入することができます。

  • GTMでPreviewモードを起動した後、拡張機能のSettingsタブでShopify Sandbox dataLayerのトグルをオンにしてください。
  • Inject GTMタブでEnable injectionをクリックし、ドメイン名とGTM IDを追加してください。変更を保存してください。
チェックアウトページへのスニペットの手動挿入

これで、チェックアウトページのイベントがGTM Previewに表示されるようになります。

Web GTM プレビューモードでのチェックアウトページ上のイベント

結論

サーバーサイドタギングの可能性は急速に拡大しており、コンバージョントラッキングとアナリティクスの精度を向上させる素晴らしいツールをユーザーに提供しています。また、StapeはクライアントがsGTMを簡単に使用できるように、Shopify用のConversion Trackingアプリをリリースしています。

Shopify用ステイプ・サーバーGTMは、数多くの機能と利点を備えた素晴らしいツールです。例えば、Google Tag Managerスクリプトを追加し、カスタムドメインとローダーを設定することで、ウェブサイトにトラッキングを簡単に設定することができます。さらに、ユーザーデータをデータレイヤーに送信し、ウェブフックを設定することもできます。

これらの機能はすべて、Cookieの寿命を延ばし、ブラウザのトラッキングをトラッキング防止技術に耐えられるようにすることで、アナリティクスのデータをより正確にするのに役立ちます。これらのツールは、サーバーのエンドポイントから広告およびマーケティングプラットフォームへの信頼性の高いデータ送信に不可欠です。

Shopifyのサーバーサイドタギングを設定するための迅速でシンプルなソリューションをお探しなら、Stapeが最適です。今すぐこの優れたソリューションを活用して、Shopify用Stape Conversion Trackingアプリで、より正確なトラッキング・インサイトのメリットを享受してください。きっとご満足いただけるはずです!

設定のお手伝いができます!

私たちにお任せください!ヘルプを得るをクリックして、フォームに記入していただければ、お見積りを送らせていただきます。

ヘルプを得る
author

Ivanna Holubovska

Author

IvannaはStapeのコンテンツ責任者で、ClutchとKyivPostの認定著者です。サーバーサイドトラッキングで戦略と分析を支援します。

コメント

Stapeを試してみてください、サーバーサイドに関するすべてのこと