UI Builder ページにタブ付きコンテンツを追加
タブコンポーネントを使用して、UI ビルダー のページにタブ付きコンテンツを追加します。
タブは構成パネルで整理して、UI ビルダー ページでの表示順序を並べ替えることができます。カスタムラベルとアイコンをタブに追加して、タブ間を移動するための一意の視覚的識別子を提供します。
- 空のコンテナタブ
- リピータータブ
- 関連リストタブ
- ページコレクションタブ
タブコンポーネントは、静的なタブ、リピーターのタブ、関連リストのタブ、およびページコレクションのタブの任意の組み合わせをサポートします。さらに、ビューポートタブモードを使用して一連のビューポートを追加することもできます。
空のコンテナタブの追加
空のコンテナタブを使用して、ページ上に静的なタブのセットを手動で作成します。
始める前に
必要なロール：管理者
手順
-
ステージの [+] アイコンを選択して、ツールボックスを開きます。
-
タブコンポーネントをページに追加します。
コンポーネントをページに追加する方法の詳細については、「コンポーネントの追加と構成」を参照してください。
-
ステージで [+ タブを追加 ] を選択します。
-
[空のコンテナから開始] を選択します。
-
[+] アイコンを選択します。
タスクの結果
ページには、作成した 2 つのタブが表示されます。各タブを選択して、さらに構成したり、スタイリングを追加したり、イベントハンドラーを追加したりします。スタイリングの詳細については、「コンポーネントのデフォルトの外観を変更する」を参照してください。イベントハンドラーの追加の詳細については、「UI Builder ページでのアクションの管理 (高度な機能)」を参照してください。
リピータータブの追加
タブコンポーネントを使用して、タブをデータアレイにリンクして、一連のリピータータブを作成します。
始める前に
必要なロール：admin
このタスクについて
リピータータブを使用して、指定したデータアレイに基づいて複数のタブを作成できます。オブジェクトのキーとして、アイコン、ラベル、カウント、およびフィールドを渡すことができます。ラベルキーを使用して、タブに名前を追加します。フィールドキーを使用して、情報をリピータータブに渡します。データブローカー、クライアントステータス、またはクライアントスクリプトをデータアレイプロバイダーにバインドして、正しいスキーマを持つオブジェクトのアレイを返すことができます。
手順
-
ステージの [+] アイコンを選択して、ツールボックスを開きます。
-
タブコンポーネントをページに追加します。
コンポーネントをページに追加する方法の詳細については、「コンポーネントの追加と構成」を参照してください。
-
ステージで [+ タブを追加 ] を選択します。
-
[リピーターを使用] を選択します。
-
[データ配列] フィールドで [編集] を選択します。
-
[適用] を選択します。
データアレイフィールドには、データアレイの構成が表示されます。
-
[作成] を選択します。
新しいリピータータブが、ページとコンテンツツリーに表示されます。プレースホルダータブのみがページを編集するときに表示されます。
-
[プレビュー] ボタンを選択してページをランタイムで開きます。
関連リストタブの追加
関連リストにリンクすることで、ページ上に一連のタブを作成します。
始める前に
必要なロール：admin
手順
-
ステージの [+] アイコンを選択して、ツールボックスを開きます。
-
タブコンポーネントをページに追加します。
コンポーネントをページに追加する方法の詳細については、「コンポーネントの追加と構成」を参照してください。
-
ステージで [+ タブを追加 ] を選択します。
-
[レコードの関連リストを表示] を選択します。
-
[作成] を選択します。
新しい関連リストタブが、構成パネルの [タブ] セクションに表示されます。1 つのプレースホルダータブのみがページプレビューに表示されます。コンテンツツリーの関連リストタブの横にある緑色のアイコンは、ページに表示されるタブの数を示します。
-
[プレビュー] ボタンを選択してページをテストします。
ページコレクションタブの追加
UI ビルダー の複数のページにまたがって同じタブを再作成するには、ページコレクションタブを使用します。
始める前に
必要なロール：admin
このタスクについて
ページコレクションは、構築済みの、グローバルに利用可能なページのグループです。ページコレクションタブを使用して、ページコレクション内の各ページをタブとして表示します。既存のページコレクションを選択することも、独自のページコレクションを作成することもできます。ページコレクションを追加するには、コントローラーが必要です。
手順
-
ステージの [+] アイコンを選択して、ツールボックスを開きます。
-
タブコンポーネントをページに追加します。
コンポーネントをページに追加する方法の詳細については、「コンポーネントの追加と構成」を参照してください。
-
ステージで [+ タブを追加 ] を選択します。
-
[ページコレクションを追加] を選択します。
-
リストからページコレクションを選択するか、[+ コレクションを作成] を選択してコレクションを作成します。
独自のページコレクションを作成するには、「複数の UI ページにわたるページコレクションの作成」を参照してください。
-
[追加] を選択します。 新しいページコレクションが構成パネルの [タブ] セクションに表示されます。1 つのプレースホルダータブのみがページプレビューに表示されます。
-
を選択し、ページを表示してテストします。
複数の UI ページにわたるページコレクションの作成
エクスペリエンス全体で使用できるタブ付きコンテンツに対応するページコレクションを作成します。
始める前に
必要なロール：admin
このタスクについて
ページコレクションを使用して、 UI ビルダーのタブコンポーネントでエクスペリエンスにタブ付きコンテンツを作成します。
ページコレクション内のページは、親ページの URL パラメーターまたはデータリソースにアクセスできません。ページコレクション内のページに条件を設定して、特定の対象者に表示するページを定義できます。ページコレクション内ではページテンプレートはサポートされません。
手順
- オプション:
必須パラメーターやオプションのパラメーターなどの詳細設定や、バリアントの設定を行います。
-
[必須パラメーターを追加] を選択して、任意の必須パラメーターをページ URL に追加します。
必須パラメーターは、sys_id、テーブル、クエリなどのページに必要なデータです。必須パラメーターは、必須パラメーターの値にバインドできるため、コンポーネントに役立ちます。
-
[オプションのパラメーターを追加] を選択して、ページの URL に追加したい任意のオプションのデータを追加します。
必須パラメーターとは異なり、オプションのパラメーターは、常に、指定された順序に関係なく機能する名前と値のペアです。
-
URL の必須またはオプションのパラメーターをクリックし、[テスト値] フィールドで値 (「incident」など) を入力します。
ページにテスト値を追加して、テスト方法としてページにデータを入力します。たとえば、必須パラメーターとしてテーブルを追加する場合は、インシデントのテスト値を追加し、そのテーブルのインシデントに関するテストデータを取り込むことができます。
-
[バリアント] タブを選択して、ページの対象者と条件を設定します。
ページを作成すると、UI ビルダー によってページのバリアントもデフォルトで作成されます。ページバリアントとは、ユーザー基準を使用してさまざまな対象者のエクスペリエンスをターゲットにできる、同じパスのページのバリエーションのことです。たとえば、マネージャー用のページと、そのマネージャーの直属の部下用のページのバリアントなどです。バリアントの作成の詳細については、「ページバリアントの作成」を参照してください。
対象者の詳細については、「対象者について学習する」を参照してください。
-
[必須パラメーターを追加] を選択して、任意の必須パラメーターをページ URL に追加します。