Bilder hinzufügen und bearbeiten

Eine Website beinhaltet keine Bilder, sie ist jedoch mit der Medienbibliothek, wo die Bilder gespeichert sind, verknüpft. Um die Bilder im Inhalt anzuzeigen, müssen die Bilder in einem Ordner in der Medien-struktur verfügbar sein. Sie können die Bilder in Episerver mithilfe des Bild-Editors bearbeiten, vorausgesetzt es beinhaltet grundlegende Bildbearbeitungsfunktionen wie beschneiden, skalieren und transformieren.

Bilder zu dem Inhalt hinzufügen

Bilder werden häufig zu dem Inhalt durch eine Bildverknüpfungseigenschaft hinzugefügt. Dort können Sie ein Bild aus einem Ordner unter der Medien-Registerkarte auswählen, wobei das Bild automatisch im Inhalt platziert und angezeigt wird.

Sie können auch die Bilder zu dem Rich-Text-Editor oder den Inhaltsbereichen in Seiten oder Blöcken mithilfe der Drag-and-Drop-Option direkt aus den Medien oder der Symbolleiste in Rich-Text-Editor hinzufügen.

Platzieren Sie den Cursor in den Bearbeitungsbereich, wo das Bild zu finden ist.
Klicken Sie auf die Schaltfläche Bild einfügen/bearbeiten in der Symbolleiste des Editors.
Geben Sie eine Bildbeschreibung für das Bild ein. Die Bildbeschreibung ist wichtig, wenn ein Leser die Anzeige von Bildern im Browser deaktiviert oder wenn ein sehbehinderter Benutzer einen Bildschirmleser verwendet.
Geben Sie einen Titel für das Formular ein. Der Titel wird angezeigt, wenn der Leser die Maus über das Bild bewegt.
Wählen Sie das gewünschte Bild in der Medien-Ordnerstruktur aus.
Klicken Sie auf Einfügen.

Bilder bearbeiten

Führen Sie einen der folgenden Schritte durch, um den Zugriff zu den Bildeditor-Optionen zu erlangen:

In dem Rich-Text-Editor klicken Sie auf das Bild und wählen Sie Bildeditor in der Symbolleiste aus.
Finden Sie das gewünschte Bild in Medien, und wählen Sie Im Bildeditor öffnen aus dem Kontextmenü aus.
—Bild: Öffnen Sie die Medien im Bildeditor –

Bildbearbeitungsfunktionen beinhalten zuschneiden, skalieren und transformieren:

Bildbearbeitung	Beschreibung
Zuschneiden	Geben Sie Werte für Oben, Links, Breite und Höhe ein oder zeichnen Sie einen Bereich im Bild für das Zuschneiden. Hinweis: Klicken Sie auf Anwenden zum Speichern der Änderungen, bevor Sie fortfahren.
Größe ändern	Geben Sie Werte für Breite und Höhe ein oder bewegen Sie einen Eckgriff, um die Größe zu ändern. Halten Sie Proportionen beschränken ausgewählt, um die Proportionen des Bildes beizubehalten. Hinweis: Klicken Sie auf Anwenden zum Speichern der Änderungen, bevor Sie fortfahren.
Umwandeln	Überschlagen oder drehen Sie das Bild oder wählen Sie Graustufen, um zu Graustufen zu konvertieren.
Voreingestellte Werte	Verwenden Sie die voreingestellten Werte fürs Zuschneiden und Skalieren, wenn solche Werte für die Website konfiguriert sind.

Sie können eine bearbeitete Bilddatei als Kopie speichern oder die Originaldatei ersetzen:

Als Kopie speichern. Wenn das Bild in einer Seite oder in einem Block ausgewählt wurde, wird die Kopie in dem lokalen Ordner gespeichert. Wenn das bearbeitete Bild in der Medienstruktur ausgewählt wurde, wird die (umbenannte) Kopie im selben Ordner wie das Original gespeichert.
Originalbild ersetzen. Diese Aktion hat eine Wirkung auf die Orte auf der Website, wo das Bild verwendet wird.

Die Auswahl der Bearbeiten-Option im Kontextmenü eines Bildes ermöglicht das Bearbeiten der Metadaten, welche für ein Bild ein Fotograf, eine Beschreibung und urheberrechtlichen Informationen und mehr sein können. Siehe Medien.

Bilder vom Inhalt entfernen

Für ein Bild in:

Eine Bild-Eigenschaft, klicken Sie auf die Option „Entfernen“.
Ein Inhaltsbereich, wählen Sie Entfernen aus dem Kontextmenü aus.
Der Rich-Text-Editor, klicken Sie auf das Bild und löschen Sie es.

Wenn das Bild entfernt wird, verschwindet es aus dem Inhalt, bleibt aber in Medien.

Bildeigenschaften ändern

Sie können die Anzeige von Bildern im Rich-Text-Editor mit einer Reihe von Eigenschaften steuern.

Einige dieser Eigenschaften (Abmessungen, Vertikaler/Horizontaler Raum und Rahmen) werden nicht in HTML5 unterstützt. Wenn Ihre Website für HTML5 konfiguriert ist, werden Sie keine nicht unterstützte Eigenschaften im Dialogfeld sehen.

Wählen Sie das Bild, das Sie ändern möchten, im Bearbeitungsbereich aus.
Klicken Sie auf die Schaltfläche Bild einfügen/bearbeiten in der Symbolleiste des Editors.
In der Registerkarte Allgemein können Sie den Titel und die Bildbeschreibung ändern. Klicken Sie auf Aktualisieren, um die Änderungen zu speichern.
In der Registerkarte Ansicht haben Sie folgende Möglichkeiten der Positionierung von Bildern in Bezug auf Text. Klicken Sie auf Aktualisieren, um die Änderungen zu speichern.

Option	Beschreibung
Abmessungen	Die Anzeigegröße eines Bildes ändern. Vergewissern Sie sich, dass Proportionen einhalten aktiviert ist, damit das Bild nicht verzerrt wird. Geben Sie die Breite des Bildes in Pixel ein und die Höhe wird entsprechend geändert.
Klasse	Wählen Sie eine CSS-Klasse aus, falls welche zur Positionierung von Bildern auf Ihrer Website verfügbar sind. Oder wählen Sie eine Option in Ausrichtung aus, um das Bild manuell zu positionieren.
Vertikaler Platz und horizontaler Platz	Fügen Sie einen Wert in Pixel für den Abstand zwischen dem Bild und dem umgebenden Text ein, wenn es nicht von der CSS-Klasse behandelt wird. Zum Beispiel könnte dies nützlich sein, wenn Sie eine große Menge an Text auf einer Seite und ein Bild mit dem Text in der rechten oberen Ecke platzieren möchten, sodass der Text um das Bild herum verfließt und etwas Abstand zwischen Bild und Text besteht. Im Fenster „Vorschau“ können Sie das Ergebnis der verschiedenen Optionen, die Sie wählen, ansehen.
Rahmen	Fügen Sie einen Wert in Pixel für den Bildrand, wenn es nicht von der CSS-Klasse behandelt wird.
Stil	In dem Stil-Feld können Sie das Inline-Styling hinzufügen. Es wird jedoch empfohlen, CSS-Klassen zu verwenden.

Auf der Erweitert-Registerkarte können Sie jedes der Folgenden ändern. Klicken Sie auf Aktualisieren, um die Änderungen zu speichern.

Option	Beschreibung
Alternatives Bild	Fügen Sie Bilder für Maus über und/oder Maus raus hinzu. Durchsuchen, um die Bilder in der Medienbibliothek auszuwählen. Um die besten Ergebnisse zu erzielen, müssen diese Bilder die gleiche Größenproportionen in Pixeln haben.
ID	Legen Sie eine eindeutige Kennung für das Bild fest, die Sie durch Stylesheets oder durch eine zusätzliche JavaScript -Funktionalität verweisen können.
Sprachrichtung	Legen Sie die Sprachrichtung (von links nach rechts oder von rechts nach links) für die Beschreibung, den Titel und andere Textattribute des Bildes fest.
Sprachcode	Stellen Sie gewünschte Sprache ein, falls der Inhalt eines Bildes in einer anderen Sprache als die eigentliche Seite ist. Geben Sie die Standard-Sprachcode-Format ein, zum Beispiel it (Italienisch), es (Spanisch), eng (Englisch) und so weiter.
Bildkarte	Das Bild einer Bildkarte zuordnen. Bildkarte stellt bestimmte Bereiche eines Bildes zu Links oder anderen Aktionen dar. Derzeit gibt es keine integrierte Möglichkeit zum Erstellen von Bildkarten in TinyMCE.
Ausführliche Linkbeschreibung	Geben Sie einen Link ein, um eine längere Bildbeschreibung als das, was in dem Beschreibungsfeld steht, zu stellen. Die meisten Browser unterstützen diese Funktion nicht. In erster Linie ist es eine Eingabehilfe.