ゲストゲートテーマコンポーネント

カスタマイズ テーマコンポーネント
162

Guest Gate v2.0 用のアナリティクス追跡システムを実装しました。GTM（Google Tag Manager）への完全な対応と、柔軟なカスタムイベントロギング機能を備えています。

追加された設定

  • enable_analytics (デフォルトで無効): 要求に応じて、追跡機能全体をオンまたはオフに切り替えます。

  • analytics_debug_logging: 有効にすると、追跡されたすべてのイベントがブラウザのコンソールに直接記録されます。GTM トリガーを設定しているセットアップ段階で特に役立ちます。

基本機能

専用のヘルパーモジュール（guest-gate-analytics.js）がイベントのディスパッチを処理します。追跡されるすべてのイベントは、同時に2つの宛先にプッシュされます。

  1. window.dataLayer.push(...): サイトで有効な場合、Google Tag Manager (GTM) および Google Analytics 4 (GA4) によって自動的に取得されます。

  2. discourse-guest-gate:analytics (カスタムブラウザイベント): さらなるコード変更を必要とせずに、サードパーティ製ツール（Matomo、Plausible、またはカスタム Webhook など）との統合を可能にします。

追跡対象イベント

  • guest_gate_shown (モーダルが表示されたときに発火)

    • guest_gate_reason: トリガーの種類（page_view、time、scroll、または lightbox）。

    • guest_gate_path: モーダルが表示された URL パス。

  • guest_gate_click (訪問者がモーダルと相互作用したときに発火)

    • guest_gate_click_action: 実行された具体的なアクション（login、signup、sso_login、sso_signup、Google ログインボタンなどの external_<provider>、またはアクションを取らずに閉じた場合の dismiss）。

    • 表示トリガーとの相互作用を簡単に相関付けるために、同じ reason と path メタデータが含まれます。

プライバシーとデータ保護

  • 個人を特定できる情報（PII）は収集・送信されません。 上記に記載された最小限の運用メタデータのみが対象です。

近日公開…:rocket:

> ./support --coffee

「いいね！」 3
163

Guest Gate v2.0 - 大規模アップデート

かなりの作業を経て、Guest Gate v2.0 のリリースができて嬉しいです。:tada:

Guest Gate は、もともと元の Guest Gate Sign Up Popup プラグイン に基づく比較的シンプルなテーマコンポーネントとして始まりました。これにより、匿名の訪問者が一定数のトピックを閲覧した後、サインアップまたはログインを促す、あるいは義務づけることが可能になります。

時間の経過とともに、このコンポーネントは著しく成長し、元の実装は拡張がますます困難になりました。

そのため、v2.0 は単なるリファクタリングやビジュアルの更新ではありません。完全に新しいトリガーシステム、より良いカスタマイズ機能、オプションの分析機能、そして内部の多数の改善を導入しています。

v2.0の新機能

複数のトリガータイプ

Guest Gate はもはやトピック/ページビューに限定されません。

現在、以下に基づいてゲートをトリガーできます：

  • ページビュー

  • 時間

  • スクロール深度

  • ライトボックス/画像のオープン

  • 任意 - 設定された最初のトリガー条件が満たされたときにゲートをトリガー

各トリガーには、独自の設定可能なしきい値があります。

また、トリガーとモーダルの表示の間の遅延を設定することもできます。

これにより、例えば以下のような異なるタイプのゲートを作成することが可能になります：

3回のページビュー後にゲートを表示。

または：

60秒後にゲートを表示。

または：

訪問者がページの70%までスクロールしたときにゲートを表示。

繰り返し動作

旧来のランダムなページビュー動作は、正式な繰り返しシステムに拡張されました。

以下から選択できます：

  • トリガーの繰り返し: 設定されたトリガーが発火するたびにゲートを表示。

  • ランダムなページビュー: ランダムな数のページビュー後にゲートを表示。

  • セッションあたり1回: ブラウザセッション中、最大で1回だけゲートを表示。

既存の「1回だけ表示」動作も、後方互換性のために保持されています。

より良いモーダルのカスタマイズ

v2.0 は、モーダル自体に対するより多くの制御を追加しました。

現在、以下を設定できます：

  • モーダルのサイズ: コンパクト、標準、またはワイド

  • 本文の揃え

  • フッターの揃え

  • タイトルの表示

  • タイトルの位置

  • ログインボタンのスタイルとアイコン

  • サインアップボタンのスタイルとアイコン

カスタムゲートも、以下に対するより良い制御を備えて改善されました：

  • 画像の揃え

  • 画像の幅

  • 画像の代替テキスト

  • 見出しの揃えと色

  • テキストの揃えと色

  • 背景色

  • フッターとリンクの色

カスタム画像は現在オプションとなり、遅延読み込みとデコードヒントも使用するようになりました。

分析

Guest Gate v2.0 には、プライバシーに配慮したオプションの分析機能が組み込まれています。

有効にすると、Guest Gate は以下を追跡します：

  • ゲートのインプレッション

  • トリガーの理由

  • ページパス

  • ログインクリック

  • サインアップクリック

  • SSOアクション

  • 閉じるアクション

イベントは window.dataLayer 経由で公開され、またブラウザイベントとして discourse-guest-gate:analytics がディスパッチされます。

これにより、Guest Gate は Google Analytics、Google Tag Manager、Matomo、またはカスタムの分析実装などの分析およびタグ管理プラットフォームと統合できます。

Guest Gate により個人データが収集されることはありません。

分析機能はデフォルトで無効になっています。

既存のインストール

v2.0 の重要な部分の一つは、既存の設定を手動で再作成する必要がないことです。

旧 Guest Gate の設定を v2 の同等の設定に移行するための設定移行が追加されました。

これには、以下のような設定が含まれます：

  • max_guest_topic_views

  • dismissable_false

  • gate_show_when_thumbnail_clicked

したがって、アップグレード後も既存の設定は引き続き動作するはずです。

このコンポーネントは現在、公式に Discourse 3.2.0 以降 を必要とします。

なぜ v2.0 なのか？

元の Guest Gate は、主に匿名の訪問者が閲覧できるトピックの数を制限することを中心に設計されていました。

v2.0 の目標は、それをはるかに柔軟にすることです。

Guest Gate は、元のユースケースをサポートしながら、一般的な 訪問者コンバージョンおよびエンゲージメントゲート として使用できるようになりました。

例えば、訪問者が以下を行った後に登録を促すために使用できます：

  • 複数のトピックを読んだ

  • サイトに一定の時間を費やした

  • 記事をスクロールした

  • 画像を開いた

  • 設定された条件の任意の組み合わせに達した

これはかなり大規模な書き直しだったので、まだ改善できる点があるかもしれません。

長年にわたり Guest Gate を使用し、テストし、フィードバックをくれた皆さんに感謝します。:heart:

OP も更新しました。

Guest Gate v2.0 が利用可能になりました。 :rocket:

> ./support --coffee :heart:

「いいね！」 4