Zuschneiden und Zentrieren von Bildern für den Slider, das Karussell und die Liste (e0)

Freitag, 18. Februar 2022

Olivier Gardiol, Polaris Team

Um eine gute Darstellung der Bilder in der Listenansicht des Inhalts (Kalender, Nachrichten, Aktionen usw.) und ggf. im Slider und im Karussell zu erreichen, ist es wichtig

  • Bilder mit ausreichenden Breiten- und Höhenrändern zu haben, um ein Zuschneiden um den anzuzeigenden Teil zu ermöglichen
  • die Motive richtig beschneiden und zentrieren (siehe Beispiel)
  • Bilder mit guter Auflösung zu verwenden und die Pixelmasse einzuhalten, die zu einer guten Darstellung beitragen.

Die Bearbeitung in Polaris erfolgt in den folgenden drei Schritten:

  1. Schritt 1: Herunterladen des kompletten Bildes
  2. Schritt 2: Zuschneiden des Bildes für die Veröffentlichung in der Listenansicht und, falls erforderlich, in der Slider- und/oder Karussellansicht
  3. Schritt 3: X-Y-Zentrierung des Bildes für diese 3 möglichen Ansichten

Ein Bild für 3 mögliche Ansichten

Schritt 1: Hochladen des Bildes

Laden Sie das komplette Bild mit möglichst viel Rand, um das Zuschneiden zu erleichtern

Schritt 1: Hochladen des Bildes

Schritt 2: Zuschneiden des Bildes

Hier muss das Bild für die verschiedenen Ansichten zugeschnitten werden, wobei zu beachten ist, dass bei einer der Ansichten, dem Schieberegler, der Titel und die Beschreibung das Bild überlagern. Diese sind je nach Länge der Texte unterschiedlich hoch.

Nachdem Sie den gewünschten Rahmen ausgewählt haben, klicken Sie auf "Zuschneiden".

Schritt 2: Zuschneiden des Bildes

Schritt 3: Zentrieren des Bildes in den drei Ansichten

Wenn Sie den Fokuspunkt mit dem Cursor / Maus bewegen, können Sie das zugeschnittene Bild von oben nach unten und von links nach rechts verschieben und das Ergebnis in den drei möglichen Ansichten des Schiebereglers, des Karussells und der Inhaltsliste betrachten.

Wenn das Ergebnis für die Ansicht(en) ausreichend ist, klicken Sie auf die Schaltfläche "Fokuspunkt setzen".

Schritt 3: Zentrieren des Bildes

Tipp

Für die Slider-Ansicht müssen Sie am unteren Rand des Bildes den notwendigen Platz für den Titel und den Text lassen, der als transparente Überlagerung erscheint.

Um eine optimale Anzeige zu gewährleisten, ist es manchmal notwendig, die Schritte 1 bis 3 mehrmals auszuführen.

Slider: Lassen Sie Platz für den Titel und den Text

Schritt 4: Wählen Sie die Größe des Bildes und der Beschreibungen

Wählen Sie den Breitenanteil, den das Bild in der Inhaltsdetailansicht einnehmen soll.

Geben Sie dann die Bildbeschriftung und den Text ein

Schritt 4: Wählen Sie das Verhältnis von Bild und Text