Bilder und Videos einbinden

Wenn es um Bildeinbindung geht, führt kein Weg um die Mediathek. Hier lernen Sie, wie Sie Bilder in Ihrer Webseite einpflegen können.

Die Anleitung beruht auf dem Block-Editor und dem WordPress Theme FAU Elemental. Im klassischen Editor und anderen Themes kann die Vorgehensweise und Darstellung abweichen.

Inhaltsverzeichnis

  1. Bilder in Inhaltsbereichen einbinden
  2. Mehrere Bilder als Galerie einbinden
  3. Videos einbinden
  4. Video-Tutorial

Bilder im Inhaltsbereich einbinden


Nachdem die Bilder in die Mediathek geladen wurden, können Sie diese wie folgt auf Inhaltsseiten einbinden:

  1. Navigieren Sie auf die Inhaltsseite, auf welcher die Bilder eingebunden werden sollen.
  2. Öffnen Sie den Block-Inserter über das blaue Plus oben links und suchen Sie den Block „Bild“. Oder tippen Sie in einem freien Bereich /bild um den Block schnell einzufügen.
  3. Laden Sie ein Bild von Ihrem Computer hoch, wählen Sie ein bestehendes Bild aus der Mediathek oder fügen Sie ein Bild über die URL hinzu.

Anhang-Details ausfüllen

  1. Falls es sich um ein nicht dekoratives Bild handelt: Vergeben Sie einen Alternativtext über die Eingabemaske in der rechten Spalte.
  2. Falls nötig, ergänzen Sie eine Bildunterschrift. Das können Sie aber auch nachträglich über die Blockwerkzeugleiste erledigen.
  3. Geben Sie die Copyright- bzw. Urheberrechtsinfo des Bildes in das Feld „Beschriftung“ ein.
  4. Scrollen Sie im Bereich „Anhang-Details“ nach unten und fügen Sie ggf. Kategorien und Schlagwörter hinzu.
  5. Bestätigen Sie das Einsetzen des Bildes über den Button „Auswählen“.
  6. Um die Position des Bildes im Inhaltsbereich zu verändern, verschieben Sie den Bildblock einfach per Drag & Drop.

Mit Bild und Text arbeiten

Im neuen Theme und im Block-Editor ist es nicht mehr möglich, Text um Bild fließen zu lassen. Standardmäßig werden Bilder und Texte untereinander dargestellt. Um Ihre Inhaltsseite visuell interessanter zu gestalten oder aufzulockern, können Sie die folgenden Blöcke nutzen. Sie können innerhalb der Blöcke auch verschiedene andere Blöcke einfügen, zum Beispiel Buttons.

Bild © Alexander London

Medien & Text Block

Im Medien & Text Block können Sie im Gegensatz zum regulären Bildblock oder anderen Bild & Text-Blöcken auch Bilder im Portraitformat einsetzen. Zudem lässt sich das Bild über den Regler problemlos skalieren.

Textspalten

Auch innerhalb des Textspalten-Blocks können verschiedene andere Blöcke eingesetzt werden. Eingesetzte Bilder setzen jedoch ein Seitenverhältnis von 3:2 voraus.

Spalten

Auch im Spalten-Block wird ein Seitenverhältnis von 3:2 für Bilder vorausgesetzt.

Eine Bildgalerie einbinden

Stellen Sie sicher, bereits einige Bilder in die Mediathek geladen zu haben. Gehen Sie anschließend wie folgt vor:

  1. Navigieren Sie auf die Inhaltsseite, auf welcher die Galerie eingebunden werden soll.
  2. Klicken Sie auf das blaue Plus oben links, um den Block-Inserter zu öffnen.
  3. Suchen Sie nach dem Block „Galerie“ und klicken oder ziehen Sie ihn, um den Block in den Inhaltsbereich einzufügen.
  4. Es öffnet sich nun die Mediathek. Wählen Sie alle Bilder per Klick aus, um sie zur Galerie hinzuzufügen. Sie können auch neue Bilder hochladen.
  5. Unterhalb der Kacheln sehen Sie die Bilder, die Sie ausgewählt haben.
  6. Klicken Sie auf den Button „Neue Galerie erstellen“.
  7. Im nächsten Screen können Sie für die Bilder optional noch Untertitel ergänzen.
  8. Klicken Sie auf den Button „Galerie einfügen“, um die Galerie in den Inhaltsbereich einzusetzen.

Der Galerie-Block im Theme FAU Elemental unterscheidet sich von der gewohnten Raster-Ansicht. Die Bilder werden im Großformat ausgegeben und können über die Pfeile links und rechts navigiert werden.

Videos einbinden

Zwar können Videos auch über die Mediathek eingebunden werden, allerdings gibt es bessere Alternativen, um ein Video einzubinden. Gleichzeitig sparen Sie sich so wertvollen Speicherplatz auf Ihrer CMS-Instanz. Gehen Sie wie folgt vor:

  1. Laden Sie Ihr Video als öffentlichen Clip im Videoportal FAU.tv hoch. Hier finden Sie eine Anleitung zur Nutzung des Videoportals.
  2. Alternativ kann auch YouTube genutzt werden. YouTube Videos können erst nach Einwilligung des Nutzers angezeigt werden.
  3. Binden Sie das Video mithilfe unseres Videoplugins ein. Hierfür aktivieren Sie das Videoplugin in der Pluginübersicht und verwenden anschließend den Block „Video“.
  4. Um mehr Weißraum unterhalb des Videos zu erzeugen, können Sie den Block „Abstandshalter“ verwenden.

Video-Tutorial

Die Video-Anleitung bezieht sich auf den Klassik-Editor und ältere Themes.