> ## 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 - Bildergalerien erstellen

> Mehrere Bilder als Galerie mit Vorschaubildern auf Ihren Seiten anzeigen lassen.

Mit Bildergalerien können Sie mehrere Bilder auf Ihren Seiten anzeigen lassen. Dabei wird eines der Bilder groß angezeigt, während die anderen sich darunter als kleine Vorschaubilder befinden.

Neben dem großen Bild befinden sich Pfeile, mit denen der Besucher Ihrer Seite zwischen den Bildern wechseln kann, sodass jeweils das nächste groß angezeigt wird. Außerdem hat man auch die Möglichkeit auf die kleinen Anzeigebilder zu klicken, um das jeweils ausgewählte groß anzeigen zu lassen.

Im Gegensatz zur Dateigalerie werden dadurch die Bilder direkt auf der Seite angezeigt, ohne dass der Benutzer diese anklicken muss.

<Note>
  Diese Anleitung gehört zu den [Inhaltsarten](/docs/de/dynamic-content/user-guide/inhaltsarten). Wie Sie generell einen Inhalt erstellen, zeigen wir Ihnen unter [Inhalte erstellen und bearbeiten](/docs/de/dynamic-content/user-guide/inhalte-erstellen).
</Note>

<Steps>
  <Step>
    ## Schritt 1: Auswählen der Inhaltsart "Bildergalerien"

    Wählen Sie zuerst bei der Erstellung eines Inhalts den Inhaltstyp "Bildergalerien" aus. Schon sollte sich ein Fenster mit der Überschrift "Neue Bildergalerie" öffnen. In diesem können Sie die Einstellungen zu Ihrer Bildergalerie treffen und die Bilder direkt hochladen.

    <Frame>
      <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/auswahl-inhaltsart.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=da979fe2deaa6048f5e8c2dd3e91a3e3" alt="Auswählen der Inhaltsart Bildergalerien" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/auswahl-inhaltsart.png" />
    </Frame>
  </Step>

  <Step>
    ## Schritt 2: Beschreibung wählen

    Legen Sie dort zuerst eine Beschreibung fest. Diese dient nur der Übersichtlichkeit und wird nicht auf der ausgewählten Seite angezeigt.

    <Frame>
      <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/beschreibung.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=4f88dde863ef65288e68c3622b9a7ba1" alt="Beschreibung der Bildergalerie festlegen" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/beschreibung.png" />
    </Frame>
  </Step>

  <Step>
    ## Schritt 3: Maximale Bildbreite und -höhe festlegen

    Danach stellen Sie die Bildbreite und -höhe ein. Diese können Sie beliebig wählen, jedoch sollten Sie zumindest das gleiche Format bzw. das gleiche Seitenverhältnis wie die Originalbilder haben.

    <Columns cols={2}>
      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bildbreite.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=6e89a577d322485df29cfcfe4f491d7a" alt="Maximale Bildbreite festlegen" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bildbreite.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bildhoehe.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=23fde4d7ccd6f281b0298c6b61f3f008" alt="Maximale Bildhöhe festlegen" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bildhoehe.png" />
        </Frame>
      </Column>
    </Columns>
  </Step>

  <Step>
    ## Schritt 4: Maximale Thumbnail-Breite und -Höhe festlegen

    Als nächstes treffen Sie noch die Einstellungen zur Thumbnail-Breite und -Höhe.

    <Columns cols={3}>
      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/thumbnail-breite.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=b051facb467dde45c455e9a7e1f678a8" alt="Thumbnail-Breite festlegen" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/thumbnail-breite.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/thumbnail-hoehe.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=a94de3dc5f95021a89a62002c535db30" alt="Thumbnail-Höhe festlegen" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/thumbnail-hoehe.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/thumbnail-speichern.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=37b4bb7b036b1fbafdeb595799a149f4" alt="Thumbnail-Einstellungen speichern" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/thumbnail-speichern.png" />
        </Frame>
      </Column>
    </Columns>
  </Step>

  <Step>
    ## Schritt 5: Bilder pflegen

    Nach dem Speichern können Sie nun direkt damit beginnen Bilder zu pflegen. Dazu klicken Sie auf das "Plus" mit dem danebenliegenden Schriftzug "Neu". Außerdem haben Sie die Möglichkeit mehrere Bilder gleichzeitig per Drag & Drop hochzuladen.

    <Columns cols={3}>
      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bilder-pflegen-1.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=5954281b28caee0a0e1de7458c072fab" alt="Bilder über Plus-Button hinzufügen" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bilder-pflegen-1.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bilder-pflegen-2.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=6fe827ac1e05b881ef588693b55bf61e" alt="Bild-Upload Fenster" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bilder-pflegen-2.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bilder-pflegen-3.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=cf0a66e2fe9612371bde2b3e12ba4b68" alt="Datei auswählen" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bilder-pflegen-3.png" />
        </Frame>
      </Column>
    </Columns>

    <Columns cols={2}>
      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bilder-pflegen-4.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=87acd8f2067cabd42125e29501a0c379" alt="Drag & Drop Bilder hochladen" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bilder-pflegen-4.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bilder-pflegen-5.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=071819fc960026b5abea28e59253a4d2" alt="Hochgeladene Bilder in Übersicht" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bilder-pflegen-5.png" />
        </Frame>
      </Column>
    </Columns>
  </Step>

  <Step>
    ## Schritt 6: Bild-Beschreibung anpassen

    In der Übersicht sehen Sie dann die Bilder, welche Sie hochgeladen haben. Für diese wurde bereits eine automatische Beschreibung anhand des Bildnamens generiert. Durch Doppelklick auf das jeweilige Bild können Sie diese bearbeiten.

    <Columns cols={3}>
      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bild-beschreibung-1.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=f3f2be0c9ad5f4f1e94b7aa04df4c327" alt="Übersicht der hochgeladenen Bilder" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bild-beschreibung-1.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bild-beschreibung-2.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=06c2a1231649c580c0b9fc8fa48d2111" alt="Bild zum Bearbeiten öffnen" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bild-beschreibung-2.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bild-beschreibung-3.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=e073ce946d7dd1d6b48dbf4c6f3d81a7" alt="Bild-Beschreibung bearbeiten" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bild-beschreibung-3.png" />
        </Frame>
      </Column>
    </Columns>

    <Columns cols={2}>
      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bild-beschreibung-4.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=1e412df383ac0a3ea08fe983e7dd0054" alt="Beschreibung anpassen" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bild-beschreibung-4.png" />
        </Frame>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/dcag/NHJ2s69sWhUfX2Ig/images/dynamic-content/inhaltsarten/bildergalerien/bild-beschreibung-5.png?fit=max&auto=format&n=NHJ2s69sWhUfX2Ig&q=85&s=c16c0e7ac451afce11f99c2f7d07e8f2" alt="Beschreibung speichern" width="1080" height="643" data-path="images/dynamic-content/inhaltsarten/bildergalerien/bild-beschreibung-5.png" />
        </Frame>
      </Column>
    </Columns>
  </Step>
</Steps>

## Verwandte Themen

<CardGroup cols={2}>
  <Card title="Inhaltsarten" icon="shapes" href="/docs/de/dynamic-content/user-guide/inhaltsarten">
    Übersicht aller verfügbaren Module.
  </Card>

  <Card title="Inhalte erstellen und bearbeiten" icon="pen-to-square" href="/docs/de/dynamic-content/user-guide/inhalte-erstellen">
    Inhalte auf Seiten anlegen.
  </Card>

  <Card title="Slideshows" icon="images" href="/docs/de/dynamic-content/user-guide/inhaltsarten/slideshows">
    Bilder als Slideshow präsentieren.
  </Card>

  <Card title="Dateigalerien" icon="folder-open" href="/docs/de/dynamic-content/user-guide/inhaltsarten/dateigalerien">
    Dateien als Galerie zum Download bereitstellen.
  </Card>
</CardGroup>
