デフォルトのフラグメントリファレンス
Liferayは様々なフラグメントをすぐに利用できるため、ソリューションの構築をすぐに始めることができます。 利用可能なフラグメントを表示するには、コンテンツページまたはページテンプレートの編集を開始してください。 編集中に、編集サイドバーメニューから、 Fragment and Widgets タブ (
) を開いてください。
フラグメントは、次のセットに編成されています。
利用可能な設定オプションは、フラグメントおよびフラグメントサブエレメントによって異なる。 詳細については、 フラグメントの設定 を参照してください。
レイアウト要素
Liferay 7.3+ 用
Layout Elements ページやテンプレートのレイアウトをデザインするためのドロップゾーンを定義します。 デフォルトでは、Liferayには コンテナ と グリッド の2つのレイアウト要素が含まれています。
| フラグメント | 説明 |
|---|---|
| コンテナ （旧： パネル） | 構成可能なドロップゾーンを追加します。 |
| グリッド (以前は 行) | 複数のドロップゾーンモジュールを追加します。 これらのモジュールは、垂直または水平に構成および配置できます。 |
基本コンポーネント
これらは、ページに基本的な機能を追加するシンプルなデザイン要素です。 例としては、ボタン、見出し、タブなどがあります。 これらのコンポーネントを使用すると、ページを少しずつ作成できます。 DXPには、次の基本コンポーネントが含まれています。
| フラグメント | 説明 |
|---|---|
| ボタン | プライマリ、セカンダリ、リンク、外枠（プライマリ）、外枠（セカンダリ）の5つの使用可能なボタン種別を持つリンク要素を追加します。 |
| カード | 表示カードとして配置された画像、リッチテキスト、リンク要素を追加します。 |
| ドロップダウン 7.4+ | 単純なテキスト要素とドロップゾーンを追加します。 他のフラグメントやウィジェットをドロップゾーンにドラッグ＆ドロップすることで、高度なドロップダウンメニューを作成することができます。 |
| 外部ビデオ 7.4+ | ページやテンプレートに外部ビデオを埋め込む。 対応するビデオソースは、YouTube、Facebook、Twitch、Vimeo、およびドキュメントとメディアに保存されているビデオです。 詳細は、Embedding Videosを参照してください。 |
| 見出し | H1-H6スタイルを使用するように構成できる単純なテキスト要素を追加します。 |
| HTML | 編集可能なHTML要素を追加します。 要素をダブルクリックすると、HTML構文を使用してコンテンツを編集できるモーダルウィンドウが開きます。 |
| 画像 | 構成可能な画像要素を追加します。 構成するときは、画像の元のサイズを使用するか、コンテキストに合わせて調整するかを決定します。 |
| パラグラフ | リッチテキスト要素を追加します。 編集するときは、フラグメントのテキストを強調表示して、追加のフォーマットオプションにアクセスします。 |
| セパレーター（区切り文字) | ページ要素間に水平線を追加します。 その間隔と色を構成できます。 |
| スライダー | スライドにグループ化されたリッチテキストオーバーレイを使用して複数の画像を追加します。 ユーザーは各スライドを手動で切り替えることができます。 |
| ソーシャル | Facebook、Twitter、LinkedInのアイコンを使用して画像要素を追加します。これらのアイコンは、各プラットフォームのページにリンクできます。 |
| スペーサー | ページ上のフラグメントの間に水平方向の空白を追加します。 その高さを設定できます。 |
| タブ | シンプルなテキスト要素 を持つ複数のタブと、ウィジェットやその他のフラグメントを追加するための個別のドロップゾーンを追加します。 |
| ビデオURL（以前は ビデオフラグメント） | YoutubeやDocuments and Mediaの動画をページやテンプレートに埋め込むことができます。 ビデオを自動再生、ループ、またはミュートに設定できます。 エンドユーザーからビデオコントロールを非表示にすることもできます。 詳細は、Embedding Videosを参照してください。 |
フォームコンポーネント
Liferay 7.4 U45+/GA45+ の場合
Form Componentsのフラグメントを使用して、コンテンツページ内にフォームを構築します。 これらのフラグメントは、カスタムオブジェクトのみをサポートしています。 これらにアクセスするには、少なくとも1つの公開オブジェクトを持つ必要があります。 詳しくは、 フラグメントを使ってフォームを構築する をご覧ください。
| フラグメント | 説明 |
|---|---|
| フォームコンテナー | コンテンツページ内にフォームを構築するためのコンテナを追加します。 追加したら、コンテナをカスタムオブジェクトにマッピングする必要があります。 コンテナは、オブジェクト内の各フィールドに対して、自動的にフォームフラグメントを生成する。 コンテナへのフラグメントの追加や削除、フォーム送信時のカスタムサクセスメッセージの設定が可能です。 マッピングされたフォームコンテナには、他のフォームコンポーネントのみを配置することができます。 |
| キャプチャ | フォームコンテナにCAPTCHA確認機能を追加する。 追加されたフォームコンテナは、送信の際に人間による認証を必要とします。 |
| チェックボックス | フォームコンテナにチェックボックスを追加し、ブーリアンフィールドに対応させることができるようにします。 |
| 日付 | カスタム日付フィールドにマッピングできるフィールドを追加します。 |
| ファイルアップロード | 添付ファイルフィールドにマッピングできるファイルアップロードボタンを追加 . マップされた添付ファイルフィールドは、ファイルのアップロード方法を決定します。 デフォルトでは、対応するファイル拡張子が表示されます。 |
| 数値入力 | カスタムの数値フィールド（integer, long integer, decimal, precision decimalなど）にマッピングできるフィールドを追加します。 プレースホルダーの値やヘルプテキストを設定することができます。 |
| プルダウン | カスタムピックリストとリレーションシップフィールドにマッピングできるドロップダウンメニューを追加します。 マップされたフィールドに10以上のオプションが含まれる場合、ドロップダウンメニューにはオプションを照会するための検索バーも表示されます。 |
| テキスト入力 | テキストフィールド（テキスト、ロングテキスト、リッチテキストなど）にマッピング可能なフィールドを追加します。 |
| 送信ボタン | フォームの入力内容を送信するためのボタンを追加します。 すべてのフォームコンテナには、送信ボタンが必要です。 |
コンテンツの表示
Liferay 7.3+ 用
コンテンツ表示フラグメントを使用して、サイトコンテンツを個別に、またはコレクションの一部として表示します。 ページコンテンツを評価またはフラグ付けするためのページ要素を追加することもできます。 DXPには、以下のコンテンツ表示用フラグメントが含まれます。
| フラグメント | 説明 |
|---|---|
| コンテンツの表示 | ドキュメントとメディア、Webコンテンツ、ブログ、またはカテゴリからの単一のコンテンツ項目を表示します。 使用可能な構成オプションは、選択したコンテンツの種類によって異なります。 |
| コンテンツのフラグ | コンテンツ項目にフラグを立てるための要素を追加します。 |
| コンテンツの評価 | コンテンツ項目を評価するための要素を追加します。 |
| コレクションフィルター（7.4以降で利用可能） | 語彙やカテゴリーを使用してコレクション表示をフィルタリングするための要素を追加します。 |
| 適用されたフィルター（7.4以降で利用可能） | コレクション表示に適用されるフィルタを表示・管理するための要素を追加する。 |
| コレクション表示 | 手動および動的に定義されたコレクションと、コレクションプロバイダーによって定義されたコレクションを表示します。 コレクションをグリッドで表示するか、リストテンプレート（ボーダー、箇条書き、インライン、番号付き、スタイルなしなど）で表示するかを設定することができます。 詳細は、コレクション表示を参照してください。 |
Cookieバナー
Liferay 7.4以降で利用可能
| フラグメント | 説明 |
|---|---|
| Cookieバナー (シンプル) | サイトのCookieを受け入れるためのリッチテキストとリンク要素を追加します。 |
主なコンテンツ
注目コンテンツの断片は、複数のコンポーネントで構成される複雑なページ要素です。 フラグメントのレイアウトをプレビューするには、Fragment’s and Widgets パネルで Card View( 
) に切り替えてください。 Liferay には、以下の Featured Content フラグメントが含まれています。
Liferay DXP/Portal 7.3 では、各フラグメントの Information アイコン (
) にマウスを置くとレイアウトをプレビューすることができます。
バナー
バナー フラグメントを使用して、コンテンツページにテキストとリンクの要素を追加し、CTA（Call to Action）バナーを作成します。 DXPには、次のレイアウトが含まれています。
機能
Features フラグメントを使用して、テキスト、画像、リンク要素をコンテンツページに追加し、主要機能を訴求します。 DXPには、次のレイアウトが含まれています。
ハイライト
ハイライト フラグメントを使用して、画像、テキスト、リンクの要素をコンテンツページに追加し、ハイライト表示します。 DXPでは次のレイアウトが提供されています。
フッター
Liferay 7.3以降で利用可能
Footer フラグメントを使用して、 マスターページテンプレートにカスタムフッターを追加します. 各フッターには、ナビゲーションメニュー、サインインリンク、画像要素、著作権テキストが含まれています。 Liferay では、フッターフラグメントに以下のレイアウトを用意しています。
ナビゲーションバー
Liferay 7.3以降で利用可能
Navigation Bar フラグメントを使用して、 マスターページテンプレートにカスタムヘッダーを追加する. 各ナビゲーションバーには、ナビゲーションメニュー、サインインリンク、およびロゴの画像要素が含まれています。 Liferay はナビゲーションバー・フラグメントに対して以下のレイアウトを提供します。
メニュー表示
Liferay 7.4以降で利用可能
メニュー表示フラグメントを使用すると、コンテンツページにメニューを追加することができます。 デプロイ後は、あらかじめ定義された ナビゲーションメニューから選択することができます。 サイトナビゲーションに Menu Display フラグメントを設定する方法については、 サイトナビゲーションの管理を参照してください。