次の方法で共有

API Management 開発者ポータルに Google タグマネージャを統合する

適用対象: Developer | Basic | Basic v2 | Standard | Standard v2 | Premium | Premium v2

Google タグマネージャは、Google によって作成されたタグ管理システムです。 これを使用して、Web サイトでの追跡と分析に使用される JavaScript と HTML のタグを管理できます。 たとえば、Google タグマネージャを使用して、Google アナリティクス、ヒートマップ、または LiveChat などのチャットボットを統合できます。

この記事の手順に従って、Google タグマネージャを Azure API Management のマネージドまたはセルフホステッドの開発者ポータルに接続します。

Google タグマネージャをポータルに追加する

マネージドまたはセルフホステッドの開発者ポータルに Google タグマネージャを接続するには、これらの手順に従います。

重要

手順 1 ～ 3 はマネージド ポータルには必要ありません。 マネージド ポータルを使用する場合は手順 4 に進んでください。

  1. 開発者ポータルの最新リリース用にローカル環境を設定します。

  2. npm パッケージをインストールして、Paperbits for Google Tag Manager を追加します。

    npm install @paperbits/gtm --save

  3. startup.publish.ts フォルダー内の src ファイルで、GTM モジュールをインポートして登録します。

    import { GoogleTagManagerPublishModule } from "@paperbits/gtm/gtm.publish.module";
...
injector.bindModule(new GoogleTagManagerPublishModule());

  4. ポータルの構成を取得します。

    GET /contentTypes/document/contentItems/configuration

    {
    "nodes": [
        {
            "site": {
                "title": "Microsoft Azure API Management - developer portal",
                "description": "Discover APIs, learn how to use them, try them out interactively, and sign up to acquire keys.",
                "keywords": "Azure, API Management, API, developer",
                "faviconSourceId": null,
                "author": "Microsoft Azure API Management"
            }
        }
    ]
}

  5. Google タグマネージャ構成を使用して、前の手順のサイト構成を拡張します。

    PUT /contentTypes/document/contentItems/configuration

    {
    "nodes": [
        {
            "site": { ... },
            "integration": {
                "googleTagManager": {
                    "containerId": "GTM-..."
                }
            }
        }
    ]
}

関連コンテンツ