Die Bilder müssen vor und nach dem Hochladen in die Mediathek von WordPress mit hilfreichen Infromationen ergänzt werden. Dies sind:

• erleichtern die Verwaltung der Bilder
• sind für den Betrachter sinnvoll
• sind teilweise rechtlich erforderlich

Ändere unbedingt eine automatisch erzeugten Dateinamen so ab, dass erkennbar ist, was es für ein Bild ist. Insbesondere bei ähnlichen Bildmotiven ist so eine Unterscheidung auch in der Mediathek von WordPress hilfreich.

Wenn die Bilder noch die Originalgröße haben, musst du sie noch kleiner rechnen. Dafür reicht ein einfaches Bildbearbeitungsprogramm. Wichtig ist, dass die Bilder eine Breite von 1600 Pixeln haben, um mit der Bildvergrößerung auch größer dargestellt werden zu können.
WordPress gibt vor, dass ein Upload nicht größer als 200 MB sein soll. Um die Ladezeiten einer Seite kurz zu halten, achte bitte darauf, dass bei einer Auflösung von 72 dpi oder 96 dpi die Bilder circa 150 MB groß sind. Kleiner ist besser, aber sie müssen vergrößert noch eine gute Bildqualität haben.

Das Bild kann jetzt hochgeladen werden, weil die weiteren Meta-Daten in der Mediathek eingegeben werden müssen.

Bevor du Bilder in einen Beitrag oder eine Seite einfügen kannst, müsst du diese in die Mediathek hochladen. Hierfür öffnest du am besten in WordPress die Mediathek und wählst “Datei hochladen” aus.

Links von dem Fenster für den Datei-Upload siehst du den Verzeichnisbaum in der Mediathek. Durch einen Klick mit der linken Maustaste auf das entsprechende Verzeichnis, öffnest du dieses.

In einem zweiten Fenster öffnest du nun im lokalen Laufwerk das Verzeichnis, in dem das/die betreffenden Bild/er gespeichert sind. Wenn du jetzt über Drag & Drop das/die Datei/en in das Fenster für den Mehrfachupload schiebst, färbt sich dieses für kurze Zeit blau ein.

Eine andere Möglichkeit um Bilder hochzuladen besteht mit dem Button „Dateien auswählen“. Mit entsprechendem Klick auf den Button öffnet sich automatisch ein Fenster vom lokalen Laufwerk. Nun muss der entsprechende Ordner mit den Fotos ausgewählt werden. Um die ausgewählten Fotos zu markieren hält man die Strg-Taste gedrückt und mit Klick der linken Maustaste auf die Bilder werden diese markiert. Mit einem Klick auf dem Button „Öffnen“ werden alle markierten Bilder in dem entsprechenden Ordner im Verzeichnisbaum abgelegt.

Je nach Datenvolumen der Dateien, musst du dann einen Moment warten, bis das/die Datei/en im Verzeichnis der Mediathek angezeigt werden.

Ich gehe davon aus, dass du das/die Bild/er vor dem Hochladen vorbereitet hast, so wie in der Anleitung zuvor beschrieben. Bevor du Bilder in Seiten oder Beiträge einfügst, ist es ganz wichtig, die Bilder mit den weiteren richtigen Meta-Daten zu versehen. Das hat mit dem Urheberrecht und der Barrierefreiheit zu tun.

Wenn du ein Bild anklickst, öffnet sich eine neue Darstellung. Es wird das ganze Bild gezeigt und in der rechten Spalte werden dazu alle Daten angezeigt. Dies Beginnt mit

• Dateiname
• Dateityp
• Hochgeladen von
• Dateigröße
• Abmessungen (in Pixeln)

Die Daten in diesem Informationsblock können nicht bearbeitet werden, aber sie werden sonst auch nicht angezeigt.

Es folgen die Felder, die bearbeitet werden können.

An dem ersten Feld URL ist eine Änderung bei Problemen nur durch die Webmaster zulässig!

Im zweiten Feld “Titel”, wird der Inhalt angezeigt, den du bei der Vorbereitung in den Details des Bildes eingegeben hast.

Es folgt das wichtige Feld “Beschriftung”. Es kann sein, dass hier der “Titel” auch angezeigt wird. Der Inhalt dieses Feldes, wird unterhalb des Bildes auf der Seite als Bilduntertitel angezeigt. Damit dieser stimmt, muss der Titel eventuell angepasst werden. Außerdem tragen wir das Copyright in dieses Feld nicht ein. Es ist ausreichend, wenn dies im Alternativtext und der Beschreibung steht. Diese beiden Felder werden im Folgenden beschrieben.

Bei Bildern die von Mitgliedern gemacht wurden, wird als Copyright angegeben: © Lion Squares Germany e. V.

Das Leerzeichen bei “e. V.” ist kein Fehler, sondern entspricht der korrekten Schreibweise, denn “eingetragener Verein” sind zwei Wörter. Sollten wir einmal Bilder verwenden, die ein Fotograf/in gemacht hat, der/die kein Mitglied ist, muss dessen Name angegeben werden, statt dem Vereinsnamen. Gleiches gilt auch für Bilder, die wir bei Bilderdiensten wie Fotolia gekauft haben.

In das Feld “Alternativtext” wird eine kurze Beschreibung eingetragen. Diese ist für Nutzer, denen das Bild nicht angezeigt wird, oder die es nicht sehen können. Der Text wie zum Beispiel “Gruppenfoto Board” wird aber dann ausgegeben und der Nutzer hat trotzdem eine Vorstellung davon, was er nicht sehen kann. Aus diesem Grunde bezieht sich die erste und wichtigste Regel zur Barrierefreiheit auf die Alternativtexte.

In dem Feld “Beschreibung” können weitere Informationen eingetragen werden, die aber auf den Webseiten nicht angezeigt werden. Wenn in den Detail-Daten eines Bildes im Feld “Kommentar” etwas eingetragen ist, könnte es gut hierhin übertragen werden.

Es folgt die Angabe “Hochgeladen von” die nicht bearbeitet werden kann.

Danach gibt es die Checkbox “Dekorativ”. Wichtig ist diese nur für Bilder, die als Schmuckgrafiken eingefügt werden, und keine Bildinformationen transportieren. Bei diesen Bildern ist der oben genannte Alternativtext (alt-Tag) nicht erforderlich, aber dafür ein Haken in dieser Checkbox. Diese kann also im Regelfall nicht beachtet werden.

Es folgt danach noch die Angabe des Verzeichnisses. Alles Weitere ist für die normale Bearbeitung nicht erforderlich.

Du bist in der Ansicht zur Bearbeitung eines Beitrages oder einer Seite und willst ein Bild einfügen. Dafür klickst du mit der linken Maustaste am oberen Rand des Editors auf die Schaltfläche “Dateien hinzufügen”.

Es öffnet sich dann eine neue Ansicht aus der Mediathek mit dem Namen “Dateien hinzufügen”.

In der linken Spalte kannst du die oberen Links ignorieren. Unterhalb der Überschrift “Ordner”, wird der Strukturbaum der Mediathek angezeigt. Hier klickst du das Verzeichnis an, aus dem du ein Bild einfügen möchtest, oder du nimmst es aus der Gesamtübersicht. Das Verzeichnis öffnet sich und du klickst das gewünschte Bild an. Das Bild bekommt einen blauen Rahmen, mit einem Haken in der oberen rechten Ecke und in der rechten Spalte des Fensters werden sofort alle Daten zu diesem Bild angezeigt. Kontrolliere bitte, ob diese Daten korrekt sind. Wenn du einen Fehler findest, kannst du ihn hier noch korrigieren. Ganz unten rechts ist dann die blaue Schaltfläche “In den Beitrag einfügen”.

Sobald du diese anklickst, schließt sich die Ansicht und das Bild ist an der zuvor ausgewählten Stelle eingefügt.

Klicke das Bild an und es bekommt einen Rahmen, mit Schaltflächen über dem Bild. Mit diesen Schaltflächen, kannst du die Position des Bildes zum Text festlegen. Unser Standard ist zentriert.

Zum Schluss musst du noch zwei Einstellungen prüfen/auswählen. Klicke dafür auf die Schaltfläche mit dem Stift.

In der linken Hälfte kannst du die Größe der Darstellung auswählen. Wenn hier nicht automatisch „Groß 1024 x 768“ angezeigt wird, wähle dieses bitte aus.

Darunter gibt es ein Pull-down-Menü zur Auswahl der Verlinkung. Falls hier zum Beispiel „Keine“ steht, wähle „Medien-Datei“ aus.

Bestätige die Eingaben mit der Schaltfläche unten rechts.
Wenn du das getan hast, vergesse nicht die Seite zu Speichern/Aktualisieren.

In der Bearbeitungsansicht eines Beitrages oder Seite, gibt es in der rechten Spalte ganz unten den Link “Beitragsbild festlegen”.

Gemeint ist damit das Vorschaubild, dass in den Beitragsübersichten angezeigt wird. Dies kann, muss aber nicht dasselbe Bild sein, wie das Bild im Beitrag. Wenn du den Link anklickst, kannst du genauso wie oben beschrieben das richtige Bild auswählen. Dieses wird dann unten in der rechten Spalte angezeigt und in den entsprechenden Übersichten.

Denke daran, den Beitrag zu aktualisieren, damit deine Eingabe gespeichert wird.

Als Beispiel in dieser Anleitung, dient die Bildauswahl für eine Bildergalerie zum Clubabend in Dreisen.

Du klickst dich in der ownCloud von Content Management Team > Daten für die Website > 1.3 Termine > … bis zu dem Verzeichnis für das Event durch. Wenn darin das Unterverzeichnis für die Bildergalerie „Bildergalerie CA Dreisen“ lautet, dann sind in diesem Verzeichnis noch nicht bearbeitete Bilddateien. Steht am Ende des Verzeichnisnamens eine „1600“, dann sind die Bilder schon zum Hochladen in die Mediathek vorbereitet.

Öffne das Verzeichnis und prüfe die Dateinamen.
Vor der automatisch erzeugten Dateibezeichnung sollte das Datum, Event und Ort genannt sein. Ohne diese Angaben, sind Bilder in der Mediathek nicht so gut von einander zu unterscheiden. In unserem Beispiel sind die Dateinamen ergänzt mit „20190811 CA Dreisen“. Ist das noch nicht so, dann passe die Dateinamen zunächst an. Dazugehört auch, die Dateinamen mit einer Bildnummer zu versehen. Für das erste Bild lautet der Eintrag dann „2019 CA Dreisen B01“.

Jetzt öffnest du dein Bildbearbeitungsprogramm und bereitest die Bilder zum Hochladen vor, so wie am Anfang auf dieser Seite beschrieben.

In der Mediathek werden alle Medien nach Reihenfolge des Hochladens angezeigt. Das zuletzt hochgeladene Medium steht immer in der obersten Zeile ganz links. Damit die Bilder nach dem Hochladen von links nach rechts in aufsteigender Reihenfolge stehen, fange mit dem letzten Bild an.

Beschriftung der Bilder

• Öffne das erste Bild in der Mediathek
• Füge in das Feld Alternativtext die Bildinformationen im folgenden Format ein:
  Bild 1: Clubabend Dreisen 11. August 2019, © Lion Squares Germany e. V.
• In das Feld Beschriftung füge Informationen in diesem Format ein:
  Bild 1: Clubabend Dreisen 11. August 2019
  Der Hinweis auf das Copyright entfällt in diesem Feld.

Bildergalerie erstellen

• Zur Erstellung der Bildergalerie klickst du in der Menüleiste das Plugin Weaver Slider Post an und danach auf „New Weaver Slider Post“.
• Es öffnet sich ein Fenster, dass so aussieht, als wenn du einen Beitrag anlegen wolltest.
• Gebe im Titel wieder Datum, Event und Ort an, wie im Beispiel: 20190811 Clubabend Dreisen
• Setze den Schreibcusor mit einem Klick in den Editor und klicke danach auf Dateien hinzufügen
• Es öffnet sich ein Fesnter mit der gesamten Medienübersicht der Mediathek > Klicke oben links in diesem Fenster auf Galerie erstellen
• Halte die Strg-Taste gedrückt und wähle alle Bilder für die Galerie mit Mausklick aus > Bestätige deine Auswahl unten rechts mit „Galerie erstellen“
• Klicke jedes Bild an > klicke in der eingeblendeten Auswahl für das Bild auf den Stift > Wähle Folgendes aus, wenn die Einstellung eine andere sein sollte
  – Ausrichtug: Zentriert
  – Größe: Groß – 1024 x 768
  – Link zur Medien-Datei
  – Unten rechts mit „Aktualisieren“ jeweils bestätigen.
• Zum Schluss noch den Weaver Slider Post mit „Veröffentlichen“ beziehunsweise „Aktualisieren“ speichern.

Shortcode für den Slider generieren

• Weaver Posts & Slider Options > Sliders
• Trage im Feld „Enter name für new/duplikate slider“ den Namen in dem Bekannten Format ein – Beispiel: 20190811 Clubabend Dreisen“ > Klick auf die Schaltfläche „Create New Slider“
• In der Box „Slider Options“ verwendest du die Einstellungen:
  – Slider Type: Slider
  – Slider Paging: Paging Dots
  – Quick Options: Slider Post Slug: Wähle im Pulldown Menü die Bildergalerie aus, die du zuvor angelegt hast.
• Speichere deine Eingaben mit „Save Slider Options“
• In der ersten Box Select Slider ist oben rechts jetzt der Shortcode für die Slideshow eingetragen.
• Kopiere die Shortcode mit den eckigen Klammern in eine txt-Datei. So bist du sicher, keine unsichtbaren Formatierungsinformationen in den Beitrag zü übernehmen > Kopiere von hieraus den Shortcode an die Stelle, wo die Galerie angezeigt werden soll.
• Speichere den Beitrag > Die Bildergalerie ist jetzt im Beitrag zu sehen.