Elevate Zoom Galerie und externen Bildern

[eblick]

Wir nutzen die Elevate Zoom Galerie mit extern verlinkten Bildern.
Die Bilder werden in der Default Ansicht auch korrekt geladen und angezeigt, siehe Screenshots.

Allein, wenn das Thumbnail geklickt wird, erscheinen in der Großansicht nur der raw code.

Was kann hierfür ursächlich sein?

[Tim]

Wie hast du denn externe Bilder in die Galerie bekommen? Der Link selbst sieht nicht nach einem absoluten Verweis auf eine Bilddatei aus (das wird die Lightbox zwingend benötigen). Das sieht für mich nach einem API call aus, der erst ein Bild generiert und roh zurücksendet. Dieser Rückgabewert sieht nach einem base64 Format aus. Das wird die Lightbox nicht verarbeiten können, denke ich. Du wirst eine reale Datei benötigen auf der anderen Seite und den absoluten Pfad dahin.

Alternativ muss ein Bild aus dem Wert erstellt werden und das Contao Dateisystem gespeichert werden. Dieser Bildpfad muss dann an die Lightbox gegeben werden. Quasi als ob man ein normales lokales Bild aufruft.

Wenn das nicht alles hyper dynamisch sein muss, ist man besser beraten man kopiert die benötigen Bilder nach Contao und erstellt die Galerie ganz normal klassisch.

[eblick]

<div id="elevatezoom_gallery_<?php echo $this->id; ?>" class="elevatezoom_gallery gallery">
<ul class="cols_4" id="gallery_<?php echo $this->id; ?>" itemscope itemtype="http://schema.org/ImageGallery">
<?php foreach ($images as $imageName=>$value): ?>
<?php if ($imageName == 'image_front' || $imageName == 'image_side' || $imageName == 'image_top' || $imageName == 'image_ambiant'):?>
<li class="entry row4" itemscope itemtype="http://schema.org/ImageObject">
<a class="elevatezoom_gallery button" href="" title="" data-image="https://domain.de/alterra-base/mimes/get/<?= $value->uid; ?>?type=png&width=1000" data-zoom-image="https://domain.de/alterra-base/mimes/get/<?= $value->uid; ?>?type=png&width=1000" itemprop="contentUrl">
<img src="https://domain.de/alterra-base/mimes/get/<?= $value->uid; ?>?type=png&width=250" width="" alt="<?= $value->metadata->alt; ?>" title="<?php echo $value->metadata->title; ?>">
</a>
</li>
<?php endif ?>
<?php endforeach; ?>
</ul>
</div>

[Tim]

Jup, das ist ein base64 Rückgabewert. <img src> frisst base64, die lightbox nicht. Das erstellte Bild musst du lokal speichern und der Lightbox den Pfad zum lokalen Bild übergebe.

[eblick]

och nö...gibt es hier keinen workaround?

[Tim]

och nö...gibt es hier keinen workaround?

Nein. Oder ich kenne ihn nicht.

Das lokale Speichern bringt viele Vorteile. Nicht nur, dass die gewünschte Funktion damit funktioniert , auch müssen die Bilder nicht bei jedem Laden der Seite aus einer "unbekannten" Quelle neu laden, sondern können aus dem Cache geladen werden bzw. lokal - was ungleich performanter und sicherer ist (auch gegenüber vermeintlichen Datenschutz-Fragen).