---
title: "Academy Article"
canonical_url: "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten"
locale: de
meta:
  "og:title": "Academy Article"
---

[Zur Startseite](https://academy.laioutr.com/)

- [Studio](https://academy.laioutr.com/bereiche/studio)

- [Inhalte und Medien](https://academy.laioutr.com/leitfaeden/inhalte-und-medien)

- [Medien in Cockpit und Studio verwalten](https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten)

# Medien in Cockpit und Studio verwalten

Bilder, Videos und Audiodateien werden zentral in der Media Library unter Content in Cockpit verwaltet. In Studio wählt der Medienwähler Dateien aus allen verbundenen Bibliotheken, etwa aus dem Shop-System, und lädt neue hoch, wo die Bibliothek es erlaubt.

## Bevor du startest

<dl>

<dt>Tarif</dt>
<dd>Alle Pläne</dd>

<dt>Rolle</dt>
<dd>Bearbeiten in Studio und Recht zum Bearbeiten von Inhalten</dd>

<dt>Dauer</dt>
<dd>5 Min.</dd></dl>

### Voraussetzungen

- Optional: App mit eigener Medienbibliothek, zum Beispiel Shopify oder Shopware

Zuletzt geprüft am 15. Oktober 2026

Medien werden in Sections und Blocks gebraucht: im Hero-Banner, in Produktkacheln, in Content-Blöcken. Laioutr verwaltet sie an zwei Stellen. In Cockpit liegt unter **Content** die **Media Library** des Projekts. Dort werden Dateien zentral hochgeladen, in Ordnern sortiert, umbenannt, verschoben und gelöscht.

In Studio öffnet jedes Medienfeld den **Medienwähler**. Er fasst mehrere Bibliotheken zusammen: die eigene Media Library und die Bibliotheken installierter Apps, etwa Shopify Files oder Shopware Media. Je nach Bibliothek gibt es Suche, Sortierung, Ordner und Upload. Dateien, die noch verarbeitet werden, zeigen einen Ladehinweis; fehlerhafte Dateien sind markiert und nicht wählbar. Für Bilder und Videos lässt sich ein Fokuspunkt setzen, damit der wichtige Bildteil auf jedem Gerät sichtbar bleibt.

Gespeichert wird ein einheitliches Medienobjekt, unabhängig von der Quelle. Externe Anwendungen erhalten über einen eigenen, widerrufbaren API-Key Zugriff auf die Medien eines Projekts.

## Schritt für Schritt

1. 1 ### Schritt 1: Media Library öffnen

   In der Projekt-Seitenleiste **Content** › **Media Library** öffnen.
2. 2 ### Schritt 2: Dateien hochladen und ordnen

   Dateien hochladen und in Ordnern ablegen. Umbenennen, Verschieben und Löschen erfolgen ebenfalls hier.
3. 3 ### Schritt 3: Medienwähler in Studio öffnen

   In Studio eine Section oder einen Block mit Medienfeld auswählen und im Eigenschaften-Panel das Medienfeld öffnen.
4. 4 ### Schritt 4: Bibliothek und Datei wählen

   Oben im Wähler die Bibliothek wählen, über Suche, Sortierung oder Ordner die Datei finden und auswählen. Wo die Bibliothek es erlaubt, neue Dateien direkt hochladen.
5. 5 ### Schritt 5: Fokuspunkt setzen

   Für Bilder und Videos den Fokuspunkt auf den wichtigsten Bildteil setzen.
6. 6 ### Schritt 6: Auf Geräten prüfen

   In der Vorschau zwischen Desktop, Tablet und Telefon wechseln und den Bildausschnitt kontrollieren.

## Ergebnis prüfen

Das Medium erscheint in der Vorschau auf allen Gerätemodi mit dem gewünschten Bildausschnitt. Dateien, die über Cockpit hochgeladen wurden, stehen in der Media Library im gewählten Ordner.

## Häufige Fragen

Warum fehlt in einer Bibliothek der Upload?

Jede Bibliothek legt fest, was sie unterstützt. Manche Quellen sind nur lesbar; dann wird die Datei im Quellsystem oder in der Media Library hochgeladen.

Warum lässt sich eine Datei nicht auswählen?

Die Datei wird noch verarbeitet, etwa ein Video beim Umwandeln, oder die Verarbeitung ist fehlgeschlagen. Fehlerhafte Dateien sind markiert und gesperrt.

Woher kommen die Bilder aus dem Shop?

Apps wie Shopify oder Shopware bringen eine eigene Medienbibliothek mit. Diese erscheint im Medienwähler neben der Media Library des Projekts.

Kann eine externe Anwendung die Medien nutzen?

Ja. Ein eigener, widerrufbarer API-Key gibt einer externen Anwendung Zugriff auf die Medien genau eines Projekts.

## Passend dazu

- [Bilder über das Laioutr CDN ausliefern](https://academy.laioutr.com/artikel/bilder-ueber-das-laioutr-cdn-ausliefern)4 Min.

  Das Laioutr CDN speichert die Bilder eines Projekts in einem eigenen Speicher und liefert sie über einen eigenen Hostnamen aus. Größe und Format werden beim Abruf an der Edge angepasst, und ausgelieferte Bilder bleiben lange im Cache.
- [Sections und Blocks einsetzen](https://academy.laioutr.com/artikel/sections-und-blocks-einsetzen)7 Min.

  Sections sind die großen Bereiche einer Seite in Header, Body oder Footer, Blocks sind Inhaltseinheiten in den Slots einer Section. Beide werden im Layers-Baum hinzugefügt und angeordnet und in den Properties bearbeitet.
- [API-Keys anlegen und verwalten](https://academy.laioutr.com/artikel/api-keys-anlegen-und-verwalten)6 Min.

  API-Keys werden in den Organisationseinstellungen unter API-Keys erstellt. Ein Organisationsschlüssel authentifiziert CLI und CI/CD, ein eingeschränkter Schlüssel gibt einer externen Anwendung nur Zugriff auf die Medien eines Projekts.
- [Shopify anbinden](https://academy.laioutr.com/apps/shopify-anbinden)10 Min.

  Die Shopify-App verbindet einen Shopify-Shop über Storefront API, Customer Account API und Admin API mit Laioutr. Produkte, Kollektionen, Warenkorb, Menüs, Inhalte und Kundenlogin kommen direkt aus Shopify.

## In einer Lektion lernen

- [Medien verwalten und ausliefern](https://academy.laioutr.com/lektionen/frontend-manager-medien-verwalten)8 Min.
- [Bilder und Videos einbinden](https://academy.laioutr.com/lektionen/live-gang-bilder-und-videos)6 Min.

## [Inhalte und Medien](https://academy.laioutr.com/leitfaeden/inhalte-und-medien)

In diesem Leitfaden suchen

1. [Inhalte in Content Collections pflegen](https://academy.laioutr.com/artikel/inhalte-in-content-collections-pflegen)6 Min.
2. [Entwürfe vor dem Veröffentlichen in der Vorschau prüfen](https://academy.laioutr.com/artikel/entwuerfe-in-der-vorschau-pruefen)5 Min.
3. [Medien in Cockpit und Studio verwalten](https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten)5 Min.
4. [Märkte und Übersetzungen in Studio pflegen](https://academy.laioutr.com/artikel/maerkte-und-uebersetzungen-in-studio-pflegen)6 Min.

## Structured Data

```json
{
  "@context": "https://schema.org",
  "@graph": [
    {
      "@id": "https://academy.laioutr.com/#website",
      "@type": "WebSite",
      "inLanguage": "de",
      "name": "Default",
      "url": "https://academy.laioutr.com/",
      "workTranslation": {
        "@id": "https://academy.laioutr.com/#website"
      }
    },
    {
      "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#webpage",
      "name": "Academy Article",
      "url": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten",
      "@type": [
        "WebPage",
        "FAQPage"
      ],
      "breadcrumb": {
        "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#breadcrumb"
      },
      "isPartOf": {
        "@id": "https://academy.laioutr.com/#website"
      },
      "mainEntity": [
        {
          "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#/schema/question/1"
        },
        {
          "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#/schema/question/2"
        },
        {
          "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#/schema/question/3"
        },
        {
          "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#/schema/question/4"
        }
      ],
      "potentialAction": [
        {
          "@type": "ReadAction",
          "target": [
            "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten"
          ]
        }
      ]
    },
    {
      "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#breadcrumb",
      "@type": "BreadcrumbList",
      "itemListElement": [
        {
          "@type": "ListItem",
          "name": "Home",
          "item": "https://academy.laioutr.com/",
          "position": 1
        },
        {
          "@type": "ListItem",
          "name": "Studio",
          "item": "https://academy.laioutr.com/bereiche/studio",
          "position": 2
        },
        {
          "@type": "ListItem",
          "name": "Inhalte und Medien",
          "item": "https://academy.laioutr.com/leitfaeden/inhalte-und-medien",
          "position": 3
        },
        {
          "@type": "ListItem",
          "name": "Medien in Cockpit und Studio verwalten",
          "item": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten",
          "position": 4
        }
      ]
    },
    {
      "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#/schema/question/1",
      "@type": "Question",
      "inLanguage": "de",
      "name": "Warum fehlt in einer Bibliothek der Upload?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Jede Bibliothek legt fest, was sie unterstützt. Manche Quellen sind nur lesbar; dann wird die Datei im Quellsystem oder in der Media Library hochgeladen.</p>"
      }
    },
    {
      "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#/schema/question/2",
      "@type": "Question",
      "inLanguage": "de",
      "name": "Warum lässt sich eine Datei nicht auswählen?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Die Datei wird noch verarbeitet, etwa ein Video beim Umwandeln, oder die Verarbeitung ist fehlgeschlagen. Fehlerhafte Dateien sind markiert und gesperrt.</p>"
      }
    },
    {
      "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#/schema/question/3",
      "@type": "Question",
      "inLanguage": "de",
      "name": "Woher kommen die Bilder aus dem Shop?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Apps wie Shopify oder Shopware bringen eine eigene Medienbibliothek mit. Diese erscheint im Medienwähler neben der Media Library des Projekts.</p>"
      }
    },
    {
      "@id": "https://academy.laioutr.com/artikel/medien-in-cockpit-und-studio-verwalten#/schema/question/4",
      "@type": "Question",
      "inLanguage": "de",
      "name": "Kann eine externe Anwendung die Medien nutzen?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "<p>Ja. Ein eigener, widerrufbarer API-Key gibt einer externen Anwendung Zugriff auf die Medien genau eines Projekts.</p>"
      }
    }
  ]
}
```
