レイアウトのヘルプポップアップの構成
CPQ でバイサイドヘルプポップアップを実装します。
ヘルプポップアップは、レイアウト内のフィールドに関する詳細情報をユーザーに提供します。これらは tooltip メッセージの表示タイプに似ていますが、次の点が異なります。
- ツールヒントは、メッセージルールの条件が満たされた場合にのみ表示されますが、ヘルプポップアップは常にレイアウトに表示されます
- ツールヒントにはプレーンテキストのみが表示されますが、ヘルプポップアップには、ハイパーリンク、リスト、斜体、太字テキスト、改行、画像、動的テキストを含めることができます
- カーソルを合わせるとツールヒントが表示されますが、メッセージを表示するにはヘルプポップアップアイコンをクリックする必要があります
注:
メッセージルールの結果として表示されるメッセージを表示する方法については、「 エンドユーザーへのメッセージの表示方法を変更する」を参照してください。
ポップアップの外観
下の画像は、ユーザーがヘルプアイコンをクリックすると表示されるポップアップメッセージを示しています。ヘルプポップアップの動的テキストを説明するために、2 番目の画像は、選択した選択リストオプションの結果として表示される追加のテキストを示しています。
メッセージポップアップを実装するには、CSV レイアウトのセル K1 に「help」という列ヘッダーを追加します。
階層、列セット、またはフィールドの場合、ヘルプポップアップの形式は次のとおりです。
{"content":"<help body>","heading":"<help heading>","trigger":{"type":"icon","url":"<image.url>”,“label”: “<Label>”}}
ポップアップにアイコンの代わりにボタンを割り当てるには、「type":"button」を使用します。ボタンは次のようになります。
画像 URL を指定しない場合は、疑問符が表示されます。 [
ラベルを指定しない場合、デフォルト値は「ヘルプ」です。
ポップアップコンテンツの書式設定
次の表は、メッセージポップアップのコンテンツの書式設定を制御する方法を示しています。| 書式設定オプション | 構文 | 出力 | メモ |
|---|---|---|---|
| Bold | 太字テキスト | [テキストを太字で表示] | アスタリスクの代わりにアンダースコアを使用できます |
| 斜体 | 斜体テキスト |
[テキストは斜体で表示されます] | アスタリスクの代わりにアンダースコアを使用できます |
| 順序付けされていないリスト | アイテム\r- アイテム\r- アイテム |
|
|
| 注文済みリスト | 1.アイテム\r2。アイテム\r3。アイテム |
|
|
| 改行 |
|
1 行目 2 行目 |
|
| 「リンク」 | [リンク表示テキスト](https://www.google.com) |
[リンク表示テキストはクリック可能なリンクとして表示されます] | Javascript がサニタイズされます |
| 画像 (GIF) |  |
タイトルテキストを囲む引用符はエスケープする必要があります | |
| 動的テキスト | {{ fieldVariableName }} |
選択したフィールドの値をテキストに出力します |