Documentation

コレクションの表示

利用可能: Liferay Portal 7.3 GA6、DXP 7.3 GA1以降

コレクションページまたはコレクション表示フラグメントを追加することで、コレクションを表示できます。 これらの表示オプションの詳細は、 コレクションとコレクションページについて を参照してください。

デフォルトでは、どのユーザーもコレクションのコンテンツを表示できます。 ただし、セグメントを使用して、これらの項目の パーソナライズされたバリエーション を作成できます。 詳細は、 Customizing Collections Using Segments を参照してください。

注釈

コレクションを表示する前に、コレクションを作成する必要があります。 詳細は、 コレクションの作成 を参照してください。

ページにコレクションを表示する

コレクションを表示する最も簡単な2つの方法は、コレクションページを追加する方法と、コレクション表示フラグメントを既存のページに追加する方法です。

コレクションページでコレクションを表示する

コレクションページは、ページをコレクションにリンクします。 コレクションページには、ページの一部としてコレクション表示フラグメントが含まれます。 代わりに既存のページにコレクション表示フラグメントを追加するには、 このセクション を参照してください。

次の手順に従って、コレクションページを追加します。

  1. サイト管理] → [Site Builder] → [Pages] に移動します。

  2. 新しいページを追加したいレベルで 新規ページ ボタン (New Page) をクリックし、 [Add Collection Page] を選択します。

    ページ管理から新しいコレクションページを作成します。

  3. コレクション] タブから、コレクションの1つを選択します。

  4. 使用する [マスターページ] を選択します。

  5. コレクションページの 名前 を入力し、 [Add] をクリックします。

  6. コレクションを表示するには、そのコンテンツをページ要素にマップします。 詳細は、 Mapping Components のセクションを参照してください。

重要

コレクションページの下に子ページを作成することはできません。

これで、コレクション表示フラグメント内に選択したコレクションを表示するコレクションページができました。

コレクション表示フラグメントをページに追加する

コレクション表示フラグメントは、コンテンツページにコレクションを表示します。 選択したコレクションを任意のスタイルまたはレイアウトで表示するように構成できます。

コレクション表示フラグメントを使用して、コレクションを目的の形式で表示します。

コレクション表示フラグメントに既存のコレクションを追加するには:

  1. コンテンツページの編集アイコン (Edit icon) をクリックします。

  2. アイコン (Add widget icon) をクリックして、[フラグメントとウィジェット]パネルを開きます。

  3. フラグメントメニューの [コンテンツの表示] カテゴリの下で、 [コレクション表示] フラグメントをページ上の任意の場所にドラッグします。

  4. コレクション表示フラグメントをクリックして、 [Selection] パネルに構成を表示します。

  5. ボタンをクリックして、パネルの [General] セクションに表示するフラグメントのコレクションを選択します。

    ボタンをクリックして、コレクション表示フラグメントのコレクションを選択します。

コレクション表示フラグメントがページに表示され、選択したコレクションが表示されます。

コレクション表示フラグメントの設定

コレクション表示フラグメントを手動で追加した場合でも、コレクションページ経由で追加した場合でも、ページを編集してフラグメントを選択することで設定できます。

コレクション表示フラグメントを選択すると、コレクション内の各アセットのセクションに分割されます。 コレクションを選択すると、フラグメントの一般設定の下に新しいオプションが表示されます。

*リストのスタイル : リスト内のアセットをフォーマットするために使用されるスタイル (たとえば、グリッドまたは記号付きリストのスタイル) *レイアウト : アセットが表示される列の数 *リストアイテムのスタイル : 個々のアセットのフォーマットに使用されるスタイル。 このオプションは、選択したリストのスタイルによっては表示されない場合があります。 *最大項目数 : フラグメントが一度に表示できるアセットの最大数

構成したコレクションを含むコレクション表示フラグメントをクリックすると、より多くの構成オプションが表示されます。

コレクション内のアセットを構成どおりに表示する準備ができたら、ページを公開します。

コレクションのアセットを表示するためのコンポーネントのマッピング

表示コンポーネントをフラグメントにマッピングすることで、フラグメント内の項目のスタイル (各アセットを個別に表示する方法) を構成することもできます。

これらの要素をフラグメントのセルにドラッグして、コレクション表示フラグメント内のアセットにマップします。

注釈

コレクション表示フラグメントのリストのスタイルに対して選択したオプションによっては、コンポーネントをフラグメントにドラッグできない場合があります。 もし、コンポーネントをフラグメントにドラッグできない場合は、別のリストスタイルを選択するか、リストアイテムのスタイルで別のオプションを選択することができます。

  1. ページエディタで、コレクションを表す [コレクション表示] をクリックします。

  2. ツールのサイドバーで、 フラグメントとウィジェット(Fragment and Widgets) ボタンをクリックします。

  3. Fragments and Widgets] サイドバーパネルから、コレクション項目の表示に使用するコンポーネントをドラッグアンドドロップします。

    フラグメントまたはウィジェットをコレクション表示に追加し、表示プロパティを構成します。

    注釈

    コレクション表示に複数の項目が含まれている場合、フラグメントまたはウィジェットをそれらのいずれかにドラッグできます。 コレクション内の残りの項目は、自動的に同じレイアウト設定を使用します。

  4. [コレクション表示]でフラグメントまたはウィジェットをクリックします。

  5. もう一度クリックして、マッピングオプションにアクセスします。

  6. Mapping] 列で、コレクションにマッピングする [Field] を選択します。

    フラグメントとウィジェットをコレクション項目にマップします

  7. 必要に応じてフラグメントまたはウィジェットを追加し、コンテンツをコンテンツフィールドにマッピングします。

    フラグメントとウィジェットをコレクション表示に追加し、コンテンツフィールドをマッピングします。

  8. Publish] をクリックします。

表示項目のページネーション

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

Liferay DXP 7.4 からは、ページネーション設定を使用して コレクション項目をページ分割することができます。 このオプションには、2つの重要な利点があります。

  • コレクションは、アイテム数が多いほど見せやすくなります。 コレクション内のすべてのアイテムを表示するのではなく、一度に表示するアイテムの数を決定し、ユーザーがコレクション内のアイテムのリストを前後に移動できるようにすることができます。

  • 閲覧可能なアイテムのリストを小さなグループに分割すると、サーバーのオーバーヘッドが削減され、サーバーの応答時間とユーザーエクスペリエンスが向上します。

コレクション表示の表示アイテムをページ分割するには、

  1. コレクション表示のあるコンテントページの編集アイコン(Edit icon)をクリックします。

  2. ブラウザアイコン (Add widget icon) をクリックして、[フラグメントとウィジェット]パネルを開きます。

  3. [Page Elements]で、ページ分割を行う[Collection Display]を選択します。

  4. 一般設定で、ページネーションオプションを選択します。

    • Pagination:None(ページネーションなし)、Numeric、またはSimple(前/次のコントロール)。

    • Muximum Number of Items:各ページに表示するアイテムの数。

    コレクション表示項目のページネーションオプションを選択します。

サイト全体でのコレクションの使用状況の表示

サイトのコレクションの使用統計を確認することができます。

  1. サイト管理] → [Site Builder] → [Collections] に移動します。

  2. Collections] タブで、確認するコレクションの横にあるアクション(Actions Menu)メニューをクリックし、 [View Usages] を選択します。

 [利用数を表示] を選択して、サイト全体でコレクションがどのように使用されているかを把握します

Liferay DXP 7.2

コンテンツセットの表示

コンテンツセットは、主にアセットパブリッシャーを通じて表示されます。 これは現在、追加設定なしで表示できる唯一の方法ですが、コンテンツセットを利用する独自の外部アプリケーションまたはウィジェットを開発することができます。 コンテンツセットの作成 で、2つのコンテンツセットを作成しました。 それらをページに表示してみましょう。

コンテンツセット用のアセットパブリッシャーの構成

コンテンツセットを表示するには、空白のページから始めて、必要なアセットパブリッシャーを追加し、コンテンツセットを表示するように設定します。

  1. サイトの ホーム ページを1列レイアウトのウィジェットページとして作成します。 新しいLiferay DXPバンドルを使用している場合は、サンプルの ホーム ページから [Hello World] ウィジェットを削除するだけです。

  2. 追加] メニューを開き、 [コンテンツ管理] → [アセットパブリッシャー] を縦に重ねてページに追加してください。

  3. 一番上のアセットパブリッシャーのOptions → [設定] をクリックします。

  4. Asset Selection] の下で、 [Content Set] を選択します。

    アセットパブリッシャーには、コンテンツのソースを選択するためのオプションがいくつかあります。

  5. Select Content Set] を開き、 [選択] をクリックします。

  6. Space Program Images] コンテンツセットをクリックします。

  7. 保存] をクリックします。

これで、画像がページの上部に表示されます。 コンテンツの表示方法 (どのメタデータを表示するかなど) を管理したり、コンテンツのスタイルを設定するための ウィジェットテンプレート を作成したりできますが、表示する項目と表示する順序はコンテンツセットによって決まります。

次に、一番下のアセットパブリッシャーを他のコンテンツセットで構成します。

  1. 一番下のアセットパブリッシャーのOptions → [設定] をクリックします。

  2. データ選択方法] の下で、 [コンテンツセット] を選択します。

  3. Select Content Set] を開き、 [選択] をクリックします。

  4. Trending] コンテンツセットをクリックします。

    使用するコンテンツセットを選択します。

  5. 保存] をクリックします。

ここでも、さまざまな表示設定を管理できますが、表示される項目とその順序はコンテンツセットの基準によって決まります。

結果は、標準のアセットパブリッシャーの出力として表示されます。 ここでは、ウィジェットテンプレートを作成して、よりスタイリッシュで魅力的なものにすることができます。

既存のコンテンツセットへの項目の追加

静的コンテンツセットと動的コンテンツセットの両方の管理について説明するために、新しい画像をアップロードし、タグを付けて、手動で静的コンテンツセットに追加します。

  1. 新しい画像をアップロードし、 [カテゴリ設定] の下で、 trending というタグを付けます。

  2. 何もしなくても、画像が Trending コンテンツリストの先頭に追加されます。

    結果は、表示されるコンテンツリストに動的に追加されます。

  3. 手動セットに追加するには、 [サイト管理] → [Content & Data] → [サイトビルダー] に戻ります。

  4. Space Program Images] をクリックし、 [Space Program Images] の横にあるOptions → [編集] を選択します。

  5. アセットエントリー] の隣にある、 [選択] → [基本ドキュメント] をクリックします。

  6. 新しい画像を選択して、 [Add] をクリックします。

  7. ホーム ページに戻って、一覧に追加された画像を確認します。

コンテンツセットは、サイト全体に表示するコンテンツやその他のアセットを1か所で簡単に定義できる強力な機能です。 また、再利用が可能なので、ユーザーに優れたコンテンツを届けるための繰り返しの作業が少なくて済みます。