Using Display Page Templates
ご覧のページは、お客様の利便性のために一部機械翻訳されています。また、ドキュメントは頻繁に更新が加えられており、翻訳は未完成の部分が含まれることをご了承ください。最新情報は都度公開されておりますため、必ず英語版をご参照ください。翻訳に問題がある場合は、 こちら までご連絡ください。

複数の表示ページテンプレートを使用して複数ステップのアプリケーションを作成する

Liferay DXP 2023.Q4+/Portal GA102+

表示ページテンプレートは、専用のURLにコンテンツを表示します。 このURLを使用してコンテンツを表示するには、まず表示するためのテンプレートを定義する必要があります。

一般的に、特定のコンテンツタイプにはデフォルトの表示ページテンプレートが設定されています。 ただし、複数の表示ページテンプレートを同じコンテンツタイプに関連付け、それらのオプションのいずれかをリンクにマッピングすることは可能です。 これは、ユーザーが複数のステップを持つアプリケーション(例:カスタムオブジェクトからマッピングされた フォーム)を作成できることを意味します。 複数の表示テンプレートを使用することで、各ステップが異なる表示ページテンプレートにリンクされるため、複数のステップを持つフォームを作成できます。

表示ページテンプレート、オブジェクト、およびフォームコンテナフラグメントを使用すると、ユーザーがオブジェクトエントリを追加し、別のページでそれを編集できるページを作成できます。 そのためには、 カスタムオブジェクト、オブジェクトエントリを編集するための 表示ページテンプレート 、およびユーザーが新しいオブジェクトエントリを入力したり、既存のオブジェクトエントリのリストを表示したりできる コンテンツページ を作成する必要があります。

ヒント

Liferay DXP 2025.Q4/Portal 2026.Q1 以降、 リリース機能フラグ LPD-17564 を有効にして、カスタムオブジェクトまたは変更可能なシステムオブジェクトをフォームコンテナで使用できるかどうかを制御します。 オブジェクト定義では、スイッチャー フォームコンテナでのマッピングを有効にする を使用します。

タスクカスタムオブジェクト

  1. カスタムオブジェクト を作成し、 タスク というラベルを付けます。

  2. タスク オブジェクトをクリックします。

  3. 「フィールド」タブで、「 説明」というラベルのテキストタイプのフィールドを追加します。

  4. 「アクション」タブで、 アクション を追加し、 編集というラベルを付けます。

  5. アクションビルダーで、トリガーとして Standalone を選択します。

    このオプションを使用すると、 アクションをボタンにマッピングできます。

  6. アクションとして オブジェクトエントリの更新 を選択します。

    このオプションは、トリガーが作動するたびに、選択された値を使用してオブジェクトエントリを更新します。

  7. 値の追加]をクリックし、[説明]フィールドを選択します。 「新しい値」に、 説明 (フィールド名) を入力します。 これにより、オブジェクトエントリの「説明」フィールドの値が新しい値に置き換えられます。

    オブジェクトの説明値を更新する編集アクションを作成します。

  8. エラーメッセージ を追加し、 保存 をクリックします。

  9. DetailsタブでオブジェクトのScopeを選択し、右上のPublishをクリックします。

オブジェクトが公開されました。コンテンツページまたは表示ページテンプレートのフォームコンテナフラグメントを使用してフォームを生成する際に、このオブジェクトを使用できます。

タスクオブジェクトの作成

アプリケーションを表示するコンテンツページ

  1. コンテンツページを作成します。 空白のテンプレートを使用して、ページに タスクのリスト という名前を付けます。

  2. ページに Grid フラグメントを追加します。 それをクリックし、右のパネルで「モジュールの数」を2つに設定する。

  3. 「フラグメントとウィジェット」サイドバーで、「フォームコンテナ」フラグメントを探してください。 それを左側のグリッドモジュールにドラッグアンドドロップし、 Noneをクリックして、タスクオブジェクトにマッピングします。

    左側のグリッドモジュールでは、ユーザーはオブジェクトに新しいエントリを追加できます。

  4. フォームコンテナ フラグメントをクリックし、成功時の操作を ページにとどまる に設定します。

    ユーザーがオブジェクトにエントリを追加すると、ページは更新されますが、それ以外に何も起こりません。

  5. 右側のグリッドモジュールに 見出し フラグメントを追加します。 編集するには、ダブルクリックしてください。 見出しとして「タスク一覧 」と入力してください。

  6. 見出しの下の右側のグリッドモジュールに、 コレクション表示 フラグメントを追加します。 フラグメントをクリックしてください。 General タブで、Collection をクリックします。

    右側のグリッドモジュールには、タスクの一覧が表示されます。

  7. 「コレクションプロバイダー」タブで、「 タスク」を選択します。

    コレクションプロバイダは、タスク内のエントリをユーザーが設計したとおりに表示します。

  8. コレクションプロバイダに グリッド を追加し、右側のパネルで モジュールの数2 に設定します。

    グリッドは赤色で示されています。

  9. コレクション表示の左側のグリッドモジュールに 見出し フラグメントを追加し、それを 2 回クリックします。 「マッピング」タブで、フィールドとして「説明」を選択します。

    このアクションは、「説明」フィールドに追加されたテキストを「見出し」コンテンツとしてマッピングします。

  10. コレクション表示の右側のグリッドモジュールに ボタン フラグメントを追加し、テキストを 2 回クリックして編集します。 テキストを に変更し、 を編集します。

  11. ページを公開する

ページを表示したり、オブジェクトのエントリを追加したり、更新されたタスクのリストを確認したりすることはできますが、まだ不完全な状態です。 編集表示ページテンプレート を作成し、編集ボタンをページにマッピングして、ユーザーを編集表示ページテンプレートに誘導する必要があります。

アプリケーションを表示するためのコンテンツページを作成する

表示ページテンプレートを編集

  1. 表示ページテンプレートを作成し、 編集という名前を付け、コンテンツタイプとして タスク を選択します。

    表示ページテンプレートがタスクオブジェクトに関連付けられました。

  2. 「フラグメントとウィジェット」サイドバーで、「フォームコンテナ」フラグメントを探してください。 それをページにドラッグアンドドロップし、 Noneをクリックして、タスク オブジェクトにマッピングします。

    選択されたオブジェクト定義のフィールドを使用して、フォームが自動的に生成されます。

    警告

    マスターページテンプレートのフォームフィールドは、表示ページには反映されません。 表示ページのマスターページにオブジェクトにリンクされたフォームコンテナを追加した場合、そのオブジェクトに関連するフォームフィールドを表示することはできません。

  3. フォームコンテナを選択します。 成功時の操作を に設定し、ページに移動して、タスク一覧ページを選択します。

    フォームを送信すると、「タスク一覧」ページが表示されます。

  4. 送信 ボタンを 2 回クリックします。 「フィールド」で「 編集 」アクションを選択します。

    ユーザーが送信ボタンをクリックすると、タスク一覧ページが表示され、同時に編集アクションが有効になり、以前の説明値が新しく追加された値に置き換えられます。

ヒント

表示ページテンプレートでフォームコンテナフラグメントが有効になっています。 フォームコンテナフラグメントを編集して、入力フラグメントの一部のみを使用することもできます。 そして、オブジェクトのエントリが更新されると、利用可能なフィールドのみが更新されます。

必要に応じてフラグメントを編集し、フォームコンテナフラグメントをコンポジションとして保存して、コンテンツページと表示ページの両方で使用できるようにしてください。

編集表示ページテンプレートの作成

表示ページテンプレートに関するSEO上の考慮事項

表示ページがデフォルトとしてマークされている場合、

  • Sitemap.xml 設定が有効になっており、お客様は要件に応じてカスタマイズできます(互換性を損なう変更はありません)。

  • デフォルトの表示ページが特定の表示ページとしてマッピングされている場合、 <link>要素が rel="canonical" 属性とともに <head> セクションに追加され、アセットの URL を正規ページとして指します。

表示ページがデフォルトとしてマークされていない場合、これらの変更は自動的に行われます。

  • 表示ページは Sitemap.xml にインデックスされていません。

  • ロボットの設定は無効になっています。

  • "noindex, nofollow" は Robots 設定で設定されます。

  • 別のページが表示ページテンプレートへのリンクを持っている場合は、テンプレートの <a> タグに rel="nofollow" 属性を追加します。

  • 同じオブジェクトに対してデフォルトとしてマークされた表示ページが存在する場合、 <link> 要素が rel="canonical" 属性とともに <head> セクションに追加され、デフォルトの表示ページ テンプレートを正規ページとして指定します。

表示ページテンプレートのSEO設定ページ。

結果として得られるアプリケーション

結果として得られたアプリケーションを使用する前に、

  1. タスク一覧コンテンツページで、 編集 ボタンを2回クリックします。

  2. リンク タブで、リンクの下にある マップされた URL を選択し、 編集 表示ページ テンプレートを選択します。

    ユーザーが「編集」ボタンをクリックすると、編集表示ページテンプレートに移動し、そこでエントリを編集してフォームを再送信し、タスク一覧コンテンツページに戻ります。

  3. タスク一覧ページを公開する。

これでタスク一覧ページにアクセスして、アプリケーションをテストできます。 ページの左側にタスクの説明を追加してください。 ページが更新され、コレクション表示画面の右側に新しいタスクの説明が表示されます。

「編集」ボタンをクリックすると、編集表示ページに移動し、そこでエントリを編集できます。 「送信」をクリックすると、タスク一覧ページに戻ります。

ヒント

最初のステップとして表示ページテンプレートを作成し、フォームコンテナの成功時のインタラクションを「エントリ表示ページへ移動」に設定して、次の表示ページテンプレートを指すようにすることができます。 これにより、連鎖的な複数ステップのフォームが作成されます。

作成したアプリケーションをテストします。