> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dc.ag/llms.txt
> Use this file to discover all available pages before exploring further.

# dynamic content - Display Collection Preview

> Display selected collection entries as a preview on a page.

In the following, we will show you how to create a collection preview.

Unlike the "Collection" module, this does not display all collection entries, but only selected ones. This is used, for example, to highlight currently running promotions or the latest news posts on the home page.

To use this module, you must have previously created a collection. In addition, the collection should already be assigned to another page. It is also advantageous if some collection entries have already been maintained.

<Note>
  This guide is part of the [Content Types](/docs/en/dynamic-content/user-guide/inhaltsarten). We show you how to create content in general under [Creating and Editing Content](/docs/en/dynamic-content/user-guide/inhalte-erstellen).
</Note>

<Info>
  Please note that we only explain here how the collection preview module works. This assumes that you have created a page on which the content can be displayed. It is also assumed that you have already reached the window for creating content.
</Info>

<Steps>
  <Step>
    ## Step 1: Select the Content Type "Collection Preview"

    First, when creating content, select the content type "Collection Preview".

    A window with the heading "Link Collection Preview" should now open. Here you can configure the settings for your collection preview.

    In our example, we are on the home page of our website. Here we want to display the promotions that are currently available in the web shop. For this purpose, we have already created a collection and maintained the three currently running promotions as collection entries.

    <Frame>
      <img src="https://mintcdn.com/dcag/DlKD43HGX8h1zbMf/images/dynamic-content/inhaltsarten/kollektionsvorschau/step1-inhaltsart-auswaehlen.png?fit=max&auto=format&n=DlKD43HGX8h1zbMf&q=85&s=5295726cdeaedeb9afb2a1fcd936723d" alt="Selecting the content type Collection Preview" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/kollektionsvorschau/step1-inhaltsart-auswaehlen.png" />
    </Frame>
  </Step>

  <Step>
    ## Step 2: Select the Collection Type

    In the window that has just opened, first select a collection type or a collection from the corresponding drop-down. Then, in the "Page with Collection List" drop-down, select the page to which you have assigned the entire collection.

    For our example, we select the collection "Promotions" as the collection type. The collection list is located on the "Promotions" page, which is why we also select it in the second field.

    <Columns cols={3}>
      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/DlKD43HGX8h1zbMf/images/dynamic-content/inhaltsarten/kollektionsvorschau/step2-kollektion-vorschau-fenster.png?fit=max&auto=format&n=DlKD43HGX8h1zbMf&q=85&s=07bc4d7dca592c1644171964b36c12d7" alt="Link Collection Preview window" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/kollektionsvorschau/step2-kollektion-vorschau-fenster.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/DlKD43HGX8h1zbMf/images/dynamic-content/inhaltsarten/kollektionsvorschau/step2-kollektionstyp-auswahl.png?fit=max&auto=format&n=DlKD43HGX8h1zbMf&q=85&s=0c7c8c12b8a6ac0846c8943f70c4a54f" alt="Selecting the collection type" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/kollektionsvorschau/step2-kollektionstyp-auswahl.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/DlKD43HGX8h1zbMf/images/dynamic-content/inhaltsarten/kollektionsvorschau/step2-seite-mit-kollektionsliste.png?fit=max&auto=format&n=DlKD43HGX8h1zbMf&q=85&s=e8dddf432a6110446d3c7aafc5713c3b" alt="Selecting the page with the collection list" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/kollektionsvorschau/step2-seite-mit-kollektionsliste.png" />
        </Frame>
      </Column>
    </Columns>
  </Step>

  <Step>
    ## Step 3: Select the Preview Type

    Now select the preview type from the drop-down of the same name. Here you have various options, which have usually been customised for you.

    In our example, we have chosen the preview type "Collection List", as several promotions are to be displayed in a list. For the number of elements, we set 3, as we currently have three running promotions maintained as collection entries.

    Finally, save everything and the collection preview is now created.

    <Columns cols={3}>
      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/DlKD43HGX8h1zbMf/images/dynamic-content/inhaltsarten/kollektionsvorschau/step3-vorschautyp.png?fit=max&auto=format&n=DlKD43HGX8h1zbMf&q=85&s=a11ad2e7611ad42cb022a796971efafc" alt="Selecting the preview type Collection List" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/kollektionsvorschau/step3-vorschautyp.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/DlKD43HGX8h1zbMf/images/dynamic-content/inhaltsarten/kollektionsvorschau/step3-anzahl-elemente.png?fit=max&auto=format&n=DlKD43HGX8h1zbMf&q=85&s=e424a5830ddea30033de797fae5b877c" alt="Setting the number of elements" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/kollektionsvorschau/step3-anzahl-elemente.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/DlKD43HGX8h1zbMf/images/dynamic-content/inhaltsarten/kollektionsvorschau/step3-speichern.png?fit=max&auto=format&n=DlKD43HGX8h1zbMf&q=85&s=98c59cb2007a58827f034719ae120e16" alt="Saving the collection preview" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/kollektionsvorschau/step3-speichern.png" />
        </Frame>
      </Column>
    </Columns>
  </Step>
</Steps>

## Related Topics

<CardGroup cols={2}>
  <Card title="Content Types" icon="shapes" href="/docs/en/dynamic-content/user-guide/inhaltsarten">
    Overview of all available modules.
  </Card>

  <Card title="Creating and Editing Content" icon="pen-to-square" href="/docs/en/dynamic-content/user-guide/inhalte-erstellen">
    Create content on pages.
  </Card>

  <Card title="Display Collections" icon="folder-tree" href="/docs/en/dynamic-content/user-guide/inhaltsarten/kollektionen-anzeigen">
    Embed complete collections on a page.
  </Card>

  <Card title="Article Preview" icon="tag" href="/docs/en/dynamic-content/user-guide/inhaltsarten/artikelvorschau">
    Display selected web shop articles in a scrollable view.
  </Card>
</CardGroup>
