Photoswipe Plugin for JoomGallery zeigt Hochformat Fotos gedehnt im Querformat an

Hallo

Ich habe die Website unseres Vereins übernommen. Das Template ist etwas veraltet und nicht responsive. Zur Bilderverwaltung wird JoomGallery verwendet. Bilder in der Detailansicht konnten auf Smartphones nicht durch "swipen" eins nach dem anderen angesehen werden. Ich habe hier gelesen, dass das Photoswipe Plugin für JoomGallery eine Lösung sein kann. Dies ist jetzt installiert und funktioniert grundsätzlich.

Das Problem ist, dass hochformatige Bilder nicht im Hochformat sondern gedehnt im Querformat angezeigt werden. Die Bilder werden auf dem PC mit der Slimbox korrekt im Hochformat angezeigt.

Ich wäre dankbar um Tips, wo ich mit der Fehlersuche beginnen soll.

Joomla 3.9.28

JSN Epic Free 6.2.1 (Template)

JoomGallery 3.3.4

Photoswipe Plugin 1.12

MrMusic

Danke für die Antwort. Ich habe also die JoomGallery 3.5.1 installiert:

Ich bin zuerst Mal erstaunt, dass`auf den JoomGallery Konfigurationsseiten unten noch die Version 3.3.4 ausgewiesen wird:

Leider hat sich das Problem mit der falschen Orientierung nicht erledigt. Hier ein Beispiel-Bild.

Das Bild ist aus dem Verzeichnis gallery/details.... Hier wie auch bei der Detailanzeige mit der Einstellung "Slimbox" wird das Bild korrekt im Hochformat angezeigt.

Nur mit der Einstellung "Photoswipe" wird es im Querformat und gedehnt angezeigt. Das sieht dann so aus:

Ich habe inzwischen gesehen, dass ein hochformat Foto auch im Photoswipe korrekt angezeigt wird. Dieses Foto hatte ich mit Photoshop bearbeitet; alle anderen nicht.

Ich habe mir nun mal mit Irfanview die EXIF Daten angesehen und folgendes festgesgtellt.

Das korrekt dargestellte Foto hat folgende Daten:

- ImageWidth und ExifImagewidth = 2672

- ImageHeight und ExifImageHeight = 4000

- Orientation = Top Left

Photoshop hat das Foto also als echtes Hochformat abgespeichert.

Das falsch dargestellte Foto hat fogende Daten:

- ExifImageWidth = 4000 (es gibt kein "ImageWidth" Tag)

- ExifImageHeigth = 2672 (es gitb kein "ImageHwight" Tag)

- Orientation = Left Bottom

Das Foto ist also eigentlich als Querformat gespeichert und müsste vom Anzeigeprogramm korrekt rotiert werden, um als Hochformat angezeigt zu werden.

In einem Internetartikel habe ich daraufhin gelesen, dass es Programme gibt, die das Orientation Tag nicht beachten und Fotos nur unter Berücksichtigung von Witdh/Length darstellen.

Es sieht also im Moment so aus, wie wenn das Photoswipe Plugin for JoomGallery die Exif Orientation nicht berücksichtigen würde. Oder ist das ein Problem der Browser? Das beträfe dann aber Firefox, Chrome, MS Edge, Safari. Eher unwahrscheinlich.

Gruss

Peter

Zitat von Elfangor93

Wiedereinmal ein Fall, wo Bildmetadaten mehr Verwirrung stiften als sie nützlich sind...

Was genau meinst Du damit? ImageWidth, ImageHeight und Orientation scheinen mir essentiell und nicht verwirrend.

Zitat von phunsoft

Das Foto ist also eigentlich als Querformat gespeichert und müsste vom Anzeigeprogramm korrekt rotiert werden, um als Hochformat angezeigt zu werden.

...

Es sieht also im Moment so aus, wie wenn das Photoswipe Plugin for JoomGallery die Exif Orientation nicht berücksichtigen würde.

Fehlüberlegung. Die Fotos werden zwar gedreht, aber die Dimensionen werden nicht angepasst. Die Breite ist nach wie vor vom Querformat, die Pixel werden in der Breite "gedehnt".

Korrektur: Erstere Annahme ist doch richtig, zu mindest zu einem Teil. Untersuchungen im Firefox mit dem Inspector habe folgendes ergeben:

Photoswipe ignoriert die EXIF Orientierungs-Information (dazu gibt es auch offene Issues im Git). Es nimmt lediglich die Dimensionen (Width/Height) aus den EXIF Daten und erzeugt damit Style Angaben im IMG Tag (style="width: wwwpx; heigth: hhhpx"). Diese Dimensionen sind die eines Querformatbildes, so wie die Fotos von der Kamera erstellt wurden.

Der Browser zeigt das Image (JPG) unter Berücksichtigung des Orientierungs-Tags korrekt orientiert an, dehnt es aber auf Grund der falschen Width/Height Angaben in der Horizontalen.

In diesem Issue https://github.com/dimsemenov/PhotoSwipe/issues/1623 habe ich den Hinweis gelesen, dass genau dieses Problem durch Hinzufügen von "image-orientation: from-image; object-fit: contain;" zum Style das Problem lösen könnte. Das wurde aber offenbar bisher im Photoswipe bisher nicht berücksichtigt.

Die entsprechende, im IMG Tag gesetzte CSS Class ist "pswp__img" und die wird im CSS-File "photoswipe.css" im Verzeichnis "media/plg_joomgallery_photoswipe" definiert:

.pswp__img {
  position: absolute;
  width: auto;
  height: auto;
  top: 0;
  left: 0; }

Ich habe dies testhalber wie folgt ergänzt:

.pswp__img {
  position: absolute;
  width: auto;
  height: auto;
  top: 0;
  left: 0;
  image-orientation: from-image !important;
  object-fit: contain !important; }

Jetzt werden die Fotos korrekt angezeigt.

Da ich den Quellcode von Photoswipe, bzw. des Plugins nicht kenne und auch zu wenig Kentnisse habe, diesen durchzuarbeiten, kann ich nicht beurteilen, welche unerwünschte Seiteneffekte die beiden Tags allenfalls haben. Ich lasse darum obige Modifikation weg und drehe stattdessen die Fotos verlustfrei mit IrfanView. Dann werden sie ebenfalls korrekt angezeigt.

Zitat von Elfangor93

Du kannst aber gerne im PhotoSwipe-Projekt auf GitHub nachsehen, ob die Exif Orientierung berücksichtigt wird.

Ich habe nachgeschaut, aber das "Photoswip Plugin for JoomGallery" scheint nicht Bestandteil dieses Git-Projektes zu sein und auch somst konnte ich es im Git nicht finden.

Wird das Plugin von JoomGallery zur Verfügung gestellt?

Zitat von Elfangor93

Ich habe mir inzwischen angewöhnt alle Bilder gemäss Exif-Ausrichtung zu drehen und die Orientierung in den Metadaten zurückzusetzen.

Das ist die Lehre, die ich aus der ganzen Geschichte ziehe. Habe auch gelernt, dass IrfanView ein Setting hat, damit es die Orientierung nicht berücksichtigt. Dann fällt das sofort auf.