デフォルトのフラグメントリファレンス
Liferayは様々なフラグメントをすぐに提供するので、すぐにソリューションの構築を開始することができます。 コンテンツページやページテンプレートの編集を始めると、利用可能なフラグメントが表示されます。 編集中に、編集サイドバーメニューの Fragment and Widgets タブ (
) を開く。
フラグメントは、次のセットに編成されています。
利用可能な設定オプションは、フラグメントおよびフラグメントサブエレメントによって異なります。 詳細については、 フラグメントの設定 を参照してください。
レイアウト要素
Liferay 7.3+ の場合
レイアウト要素 ページやテンプレートのレイアウトをデザインするためのドロップゾーンを定義します。 デフォルトでは、Liferayには コンテナ と グリッド の2つのレイアウト要素が含まれています。
| フラグメント | 説明 |
|---|---|
| コンテナ（旧： パネル）。 | 構成可能なドロップゾーンを追加します。 |
| グリッド（従来は 行）。 | 複数のドロップゾーンモジュールを追加します。 これらのモジュールは、垂直または水平に構成および配置できます。 |
基本コンポーネント
これらは、ページに基本的な機能を追加するシンプルなデザイン要素です。 例としては、ボタン、見出し、タブなどがあります。 これらのコンポーネントを使用すると、ページを少しずつ作成できます。 DXPには、次の基本コンポーネントが含まれています。
| フラグメント | ディスクリプション |
|---|---|
| ボタン | 5つのボタンタイプを持つlink要素を追加します： ボタンの種類は、プライマリ、セカンダリ、リンク、アウトラインプライマリ、アウトラインセカンダリの5種類です。 |
| カード | ディスプレイカードとして配置されたimage, rich text, link 要素を追加する。 |
| ドロップダウン 7.4+ | シンプルなテキスト要素とドロップゾーンを追加しました。ドロップゾーンに他のフラグメントやウィジェットをドラッグ＆ドロップすることで、高度なドロップダウンメニューを作成することができます。 |
| 外部動画 7.4+ | 外部動画をページやテンプレートに埋め込みます。サポートされているビデオソースは、YouTube、Facebook、Twitch、Vimeo、およびDocuments and Mediaに保存されているビデオです。詳しくは、動画の埋め込み を参照してください。 |
| Heading | H1-H6スタイルを使用するように設定できるシンプルなテキスト要素を追加する。 |
| HTML | 編集可能なHTML要素が追加されます。ダブルクリックするとモーダルウィンドウが開き、HTML構文で内容を編集することができます。 |
| 画像 | 設定可能な画像要素を追加します。設定時に、画像の元のサイズを使用するか、文脈に合わせて調整するかを決定します。 |
| リッチテキスト要素 を追加します。編集時には、フラグメントのテキストをハイライトして、追加の書式設定オプションにアクセスします。 | |
| セパレーター | ページ要素間に横線を入れる。間隔や色を設定することができます。 |
| スライダー | 複数の画像にリッチテキストをオーバーレイして、スライドにグループ化されたものを追加します。ユーザーは、各スライドを手動で循環させることができます。 |
| ソーシャル | Facebook、Twitter、LinkedInのアイコンを持つ画像要素を追加し、それぞれのプラットフォーム上のページにリンクすることができる。 |
| スペーサー | ページ上のフラグメントの間に水平方向の空白を追加します。高さを設定することができます。 |
| タブ | シンプルなテキスト要素とウィジェットや他のフラグメントを追加するための個々のドロップゾーンを持つ複数のタブを追加します。 |
| 動画URL（従来は*動画フラグメント） | YoutubeやDocuments and Mediaの動画をページやテンプレートに埋め込む。動画の自動再生、ループ、ミュートを設定できます。また、エンドユーザーからビデオのコントロールを隠すこともできます。動画の埋め込み を参照してください。 |
フォームコンポーネント
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を受け入れるためのリッチテキストとリンク要素を追加します。 |
主なコンテンツ
注目コンテンツの断片は、複数のコンポーネントで構成される複雑なページ要素です。 フラグメントのレイアウトをプレビューするには、フラグメントの「ウィジェット」パネルで カードビュー( 
) に切り替えます。 Liferay には、以下の Featured Content フラグメントが含まれています。
Liferay DXP/Portal 7.3では、各フラグメントのInformationアイコン(
)にマウスを合わせると、レイアウトのプレビューができます。
バナー
バナー フラグメントを使用して、コンテンツページにテキストとリンク要素を追加し、CTA（Call to Action）バナーを作成します。 DXPには、次のレイアウトが含まれています。
機能
Features フラグメントを使用して、コンテンツページにテキスト、画像、リンク要素を追加し、主要な機能をアピールします。 DXPには、次のレイアウトが含まれています。
ハイライト
Highlights フラグメントを使用すると、コンテンツページに画像、テキスト、リンクの要素を追加してハイライト表示させることができます。 DXPでは次のレイアウトが提供されています。
フッター
Liferay 7.3以降で利用可能
マスターページテンプレートにカスタムフッターを追加するには、 フッター フラグメントを使用します。 各フッターには、ナビゲーションメニュー、サインインリンク、画像要素、著作権テキストが含まれています。 Liferay では、Footer フラグメントのレイアウトを以下のように設定しています：
ナビゲーションバー
Liferay 7.3以降で利用可能
ナビゲーションバー フラグメントを使用して、 マスターページテンプレートにカスタムヘッダーを追加します。 各ナビゲーションバーには、ナビゲーションメニュー、サインインリンク、およびロゴの画像要素が含まれています。 Liferay は Navigation Bar フラグメントに以下のレイアウトを提供します：
メニュー表示
Liferay 7.4以降で利用可能
Menu Displayフラグメントを使用すると、コンテンツページにメニューを追加することができます。 展開後は、あらかじめ定義された ナビゲーションメニューから選択することができます。 サイトナビゲーションのメニュー表示フラグメントの設定方法については、「 サイトナビゲーションの管理」を参照してください。