Documentation

デフォルトのフラグメントリファレンス

Liferayには、すぐに使用できるさまざまなフラグメントが用意されているため、ソリューションの構築をすぐに開始できます。 使用可能なフラグメントを表示するには、コンテントページまたはページテンプレートの編集を開始します。 編集中に、編集サイドバーメニューの [Fragment and Widgets] タブ(Fragments and Widgets)を開きます。

フラグメントは、次のセットに編成されています。

注釈

使用可能な構成オプションは、フラグメントおよびフラグメントのサブ要素によって異なります。 詳細については、 フラグメントの設定 を参照してください。

レイアウト要素

利用可能:Liferay Portal 7.3 GA2以降、以前は パネル および を含むレイアウトと呼ばれていました。

レイアウト要素 は、ページとテンプレートのレイアウトを設計するために使用できるドロップゾーンを定義します。 デフォルトでは、Liferayには コンテナグリッド の2つのレイアウト要素が含まれています。

フラグメント

説明

コンテナ

構成可能なドロップゾーンを追加します。

グリッド

複数のドロップゾーンモジュールを追加します。 これらのモジュールは、垂直または水平に構成および配置できます。

基本コンポーネント

これらは、ページに基本的な機能を追加するシンプルなデザイン要素です。 例としては、ボタン、見出し、タブなどがあります。 これらのコンポーネントを使用すると、ページを少しずつ作成できます。 DXPには、次の基本コンポーネントが含まれています。

フラグメント

説明

ボタン

プライマリ、セカンダリ、リンク、外枠(プライマリ)、外枠(セカンダリ)の5つの使用可能なボタン種別を持つリンク要素を追加します。

カード

表示カードとして配置された画像リッチテキストリンク要素を追加します。

ドロップダウン(7.4以降で利用可能)

単純なテキスト要素とドロップゾーンを追加します。 他のフラグメントやウィジェットをドロップゾーンにドラッグアンドドロップして、高度なドロップダウンメニューを作成できます。

外部ビデオ(7.4以降で利用可能)

ページまたはテンプレートに外部ビデオを埋め込みます。 対応するビデオソースは、YouTube、Facebook、Twitch、Vimeo、およびドキュメントとメディアに保存されているビデオです。 詳細は、Liferayアセットとページへのビデオの埋め込みを参照してください。

見出し

H1-H6スタイルを使用するように構成できる単純なテキスト要素を追加します。

HTML

編集可能なHTML要素を追加します。 要素をダブルクリックすると、HTML構文を使用してコンテンツを編集できるモーダルウィンドウが開きます。

画像

構成可能な画像要素を追加します。 構成するときは、画像の元のサイズを使用するか、コンテキストに合わせて調整するかを決定します。

パラグラフ

リッチテキスト要素を追加します。 編集するときは、フラグメントのテキストを強調表示して、追加のフォーマットオプションにアクセスします。

セパレーター(区切り文字)

ページ要素の間に水平線を追加します。 その間隔と色を構成できます。

スライダー

スライドにグループ化されたリッチテキストオーバーレイを使用して複数の画像を追加します。 ユーザーは各スライドを手動で切り替えることができます。

ソーシャル

Facebook、Twitter、LinkedInのアイコンを使用して画像要素を追加します。これらのアイコンは、各プラットフォームのページにリンクできます。

スペーサー

ページ上のフラグメント間に水平方向の空白スペースを追加します。 その高さを設定できます。

タブ

ウィジェットやその他のフラグメントを追加するための、単純なテキスト要素と個々のドロップゾーンを備えた複数のタブを追加します。

ビデオURL(以前は ビデオフラグメント

Youtubeまたはドキュメントとメディアからのビデオをページまたはテンプレートに埋め込みます。 ビデオを自動再生、ループ、またはミュートに設定できます。 エンドユーザーからビデオコントロールを非表示にすることもできます。 詳細は、Liferayアセットとページへのビデオの埋め込みを参照してください。

コンテントの表示

対応可能:Liferay DXP/Portal 7.3以降

コンテンツ表示 フラグメントを使用して、サイトコンテンツを個別に、またはコレクションの一部として表示します。 ページコンテンツを評価またはフラグ付けするためのページ要素を追加することもできます。 DXPには、次のコンテンツ表示フラグメントが含まれています。

フラグメント

説明

コンテンツの表示

ドキュメントとメディア、Webコンテンツ、ブログ、またはカテゴリからの単一のコンテンツ項目を表示します。 使用可能な構成オプションは、選択したコンテンツの種類によって異なります。

コンテンツのフラグ

コンテンツ項目にフラグを立てるための要素を追加します。

コンテンツの評価

コンテンツ項目を評価するための要素を追加します。

コレクションフィルター(7.4以降で利用可能)

ボキャブラリまたはカテゴリを使用してコレクション表示をフィルタリングするための要素を追加します。

適用されたフィルター(7.4以降で利用可能)

コレクション表示に適用されるフィルターを表示および管理するための要素を追加します。

コレクション表示

手動および動的に定義されたコレクションと、コレクションプロバイダーによって定義されたコレクションを表示します。 コレクションを グリッド で表示するか、リスト テンプレート(境界付き、記号付き、インライン、番号付き、スタイルなし)で表示するかを構成できます。 詳細は、 コレクションの表示 を参照してください。

主なコンテンツ

主なコンテンツフラグメントは、複数のコンポーネントで構成される複雑なページ要素です。 フラグメントのレイアウトをプレビューするには、フラグメントとウィジェットのパネルでカードビューに切り替えます。 DXPには、次の主なコンテンツフラグメントが含まれています。

注釈

Liferay DXP/Portal 7.3の場合、各フラグメントの情報アイコン(Information)にカーソルを合わせると、レイアウトをプレビューできます。

バナー

バナー フラグメントを使用して、CTA(Call to Action)バナーを作成するためのテキストおよびリンク要素をコンテントページに追加します。 DXPには、次のレイアウトが含まれています。

Call to Actionバナーを作成するためのテキストおよびリンク要素をコンテンツページに追加します。

機能

機能 フラグメントを使用して、テキスト、画像、およびリンク要素をコンテンツページに追加し、主要な機能をプロモートします。 DXPには、次のレイアウトが含まれています。

テキスト、画像、リンク要素をコンテンツページに追加して、主要な機能をプロモートします。

ハイライト

ハイライト フラグメントを使用して、画像、テキスト、およびリンク要素をコンテンツページに追加してハイライト表示します。 DXPでは次のレイアウトが提供されています。

コンテンツページに画像、テキスト、リンクの要素を追加し、ハイライト表示します。

フッタ

利用可能:Liferay DXP 7.3以降;以前は Sections パネルに含まれていました。

フッタ フラグメントを使用して、コンテンツページのマスターページテンプレートにカスタムフッタを追加します。 各フッターには、ナビゲーションメニュー、サインインリンク、画像要素、著作権テキストが含まれています。 DXPには、フッタフラグメント用の次のレイアウトが含まれています。

コンテンツページのマスターページテンプレートにカスタムフッタを追加します。

ナビゲーションバー

利用可能:Liferay DXP 7.3以降、以前は [Sections] パネルに含まれていました。

ナビゲーションバー フラグメントを使用して、コンテンツページのマスターページテンプレートにカスタムヘッダを追加します。 各ナビゲーションバーには、ナビゲーションメニュー、サインインリンク、およびロゴの画像要素が含まれています。 DXPには、ナビゲーションバーフラグメント用の次のレイアウトが含まれています。

コンテンツページ用のマスターページテンプレートにカスタムヘッダを追加します。

メニュー表示

対応可能:Liferay DXP/Portal 7.4以降 メニュー表示フラグメントを使うと、コンテントページの任意の場所にナビゲーションメニューを作成することができます。 このナビゲーションメニューは、サイトのパブリックページやプライベートページの階層、またはLiferay DXPのナビゲーションメニューを使って定義したその他の階層に基づいています。 サイトナビゲーションのメニュー表示フラグメントの設定方法については、 サイトナビゲーションの管理を参照してください。