HTML In-App テンプレート
HTML In-App テンプレートを使用すると、柔軟な方法で高度にカスタマイズされた目を引く In-App メッセージを作成できます。これらのテンプレートを活用することで、独自の体験でユーザーのエンゲージメントを高め、アプリケーションから直接価値のあるデータを収集できます。この記事では、利用可能な HTML In-App テンプレートの種類と、MoEngage キャンペーンでの使用方法について説明します。 HTML In-App キャンペーンの作成の詳細については、In-App キャンペーン用の HTML テンプレートを参照してください。利用可能なテンプレート
HTML In-App テンプレートの使用
この GIF は、MoEngage の In-App キャンペーンでこれらの HTML テンプレートをすばやく使用する方法を示しています。
Carousel テンプレート
Carousel テンプレートを使用すると、自動的にスクロールする複数の製品、サービス、オファーを表示できます。画面スペースをあまり使わずに、さまざまなアイテムを紹介できる優れた方法です。 Carousel テンプレートをダウンロード
カスタマイズの詳細
- カルーセル内の画像ごとに異なるコールトゥアクション（CTA）を設定します。以下の画像でハイライトされているコードは、各要素のアクションを定義する方法を示しています。
moengage.trackClick(2)関数はクリックをトラッキングします。関数内の引数（(1) や (2) など）により、カルーセルの異なる要素に対するクリックを区別できます。 - モバイルデバイスでは、このテンプレートは縦向きモードで最適に動作します。横向きモードでは、ユーザーにスクロールバーが表示されます。タブレットと TV では、このテンプレートはどの向きでも正しく表示されます。
Survey テンプレート
Survey テンプレートを使用すると、アプリ内で直接ユーザーの関心、フィードバック、意見を収集できます。ユーザーの感情を把握し、製品を改善するのに役立ちます。 Survey テンプレートをダウンロード
カスタマイズの詳細
- アンケートの回答をユーザー属性として取得します。たとえば、以下のコードスニペットの 88 行目では、ユーザーの入力を
survey_responseユーザー属性として取得しています。この属性名は必要に応じてカスタマイズできます。
- ユーザーが回答を送信したときに
MOE_RESPONSE_SUBMITTEDイベントをトリガーします。88 行目の下にあるハイライトされたコードは、フィードバックフォームからのユーザー入力を含むsurvey_responseイベント属性とともに、このイベントをトラッキングします。イベント名とイベント属性名は必要に応じてカスタマイズできます。このイベントがトラッキングされた後、MoEngage の外部にデータを送信したり、フォローアップキャンペーンをトリガーしたりするために使用できます。
- 以下に示すように、このテンプレートのデータは MoEngage のユーザープロファイルに表示されます。
- モバイルデバイスでは、このテンプレートは縦向きモードで最適に動作します。横向きモードでは、ユーザーにスクロールバーが表示されます。タブレットと TV では、このテンプレートはどの向きでも正しく表示されます。
Lead Generation テンプレート
Lead Generation テンプレートを使用すると、匿名のアプリユーザーからメールアドレス、携帯電話番号、その他の情報を取得できます。不明な訪問者を識別可能なリードに変換するのに役立ちます。 Lead Generation テンプレートをダウンロード
カスタマイズの詳細
- ユーザーの入力を、First Name や Email などの MoEngage の標準属性に直接保存します。
- ユーザーがこのフォームを送信したときに
MOE_RESPONSE_SUBMITTEDイベントをトリガーします。このイベントを使用して、MoEngage の Streams や Connector Campaigns で、収集したデータを外部の API エンドポイントに送信できます。以下の画像でハイライトされているコードは、入力データをユーザー属性およびイベントとしてトラッキングします。
- このフォームでデータがトラッキングされた後、以下に示すようにユーザープロファイルで確認できます。また、このイベントを使用して、さまざまな統合を通じて MoEngage の外部にデータを送信することもできます。
Promotional テンプレート
Promotional テンプレートを使用すると、実施中のオファーや売れ筋の製品・サービスを目立たせることができます。モバイルアプリ内で売上とエンゲージメントを促進する効果的な方法です。 Promotional テンプレートをダウンロード
カスタマイズの詳細
- このテンプレートを使用して、モバイルアプリ内で実施中のオファーやセールを宣伝します。
- 以下に示すように、MoEngage JS Bridge を実装することで、ユーザーがボタンをクリックしたときに開く URL を設定し、クリックをトラッキングできます。
重要な考慮事項
HTML In-App テンプレートを使用する場合:- HTML/CSS の専門知識: これらのテンプレートを効果的にカスタマイズするには、HTML と CSS の基本的な理解が必要です。
- MoEngage JS Bridge: インタラクティブなアクションの定義やイベントのトラッキングには、MoEngage JS Bridge に関する知識が不可欠です。
- テスト: 最適な表示と機能を確保するため、カスタマイズしたテンプレートは必ずさまざまなデバイスと画面の向きで十分にテストしてください。詳細については、In-App キャンペーンのテストを参照してください。
- レスポンシブ対応: 一貫したユーザー体験を提供するため、さまざまな画面サイズと解像度に適応するレスポンシブなテンプレートをデザインしてください。
- デバッグ: ブラウザーの開発者ツールやアプリ内デバッグツールを使用して、カスタム HTML のレンダリングや機能に関する問題を特定し、解決してください。