WEBP Bilder innerhalb von OXID EShop einbinden

[mws_1941]

Originally published at: https://oxidforge.org/de/webp-bilder-innerhalb-von-oxid-eshop-einbinden.html

Um Grafiken in Googels WebP-Format durch OXID eShop ausliefern zu lassen, genügen ein paar Zeilen in der .htaccess-Datei des Shops.

[Jonas_Hess]

Achtung die Betonung liegt übrigens auf “ein paar Zeilen”.

Während bei mir der Beitrag so aussieht:

Sollte eigentlich das hier in den Quellcode der .htaccess:

RewriteCond %{HTTP_ACCEPT} image/webp
RewriteCond %{REQUEST_FILENAME} (.*)\.(jpg|png)$ 
RewriteCond %1\.webp -f 
RewriteRule ^(.*)\.(jpg|png)$ $1.webp [L,T=image/webp]

Erst auf den zweiten Blick fiel mir auf, dass kein Einzeiler sei kann.

[marco.steinhaeuser]

Verflixt, wenn man nicht zu 100% aufpasst. Danke @Jonas_Hess, ich hab nochmal nachgebessert. Passt das so jetzt?

[mws_1941]

Bei mir im Blog sieht es gut aus…

[Jonas_Hess]

Auch auf meinem Screen herrscht jetzt herrliche Mehrzeiligkeit (Danke):

[Bob_Byte]

Ich wollte das gerade mal in meinen alten 4.10.7 Shop einbinden, aber die entsprechende Passage in der .htaccess sieht bei mir so aus:

RewriteCond %{REQUEST_URI} (\/out\/pictures\/)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule (\.jpe?g|\.gif|\.png|\.svg)$ getimg.php

da gibt es kein “generated” Verzeichnis .

Was muss ich da anpassen, damit ich das trotzdem nutzen kann ?

Vielen Dank.

BB

[mws_1941]

Auch in Version 4.10 und davor gab es schon das generated Verzeichnis. Prüf mal deine Installation bzw. ob im Frontend immer nur Master Bilder ausgeliefert werden…
Gruss Marcel

[Bob_Byte]

Hi,

stimmt schon, das “generated” Verzeichnis existiert. Aber in meiner .htaccess ist der Eintrag etwas anders als oben abgebildet, obwohl ich nichts verändert habe. Das machte mich stutzig und ich wollte da den Eintrag nicht einfach ändern.

Wie kann ich das testen ob nur master-bilder ausgeliefert werden ?

Gruß BB

[mws_1941]

Wenn Du die Zeilen vor dem Part - egal ob mit oder ohne generated - einträgst, werden erstnal webp Bilder, sofern sie existieren und der Browser sie akzeptiert, ausgeliefert. Der andere Teil dient nur der Nachgenerierung der verschiedenen Auflösungen.

Gruss
Marcel

Für das Prüfen könntest Du Dir den ausgelieferten Quelltext der Seite ansehen…

[Jonas_Hess]

Ich hab das Script von twistedbrains ein wenig angepasst:

#!/bin/bash

for D in `find /var/www/share/...../source/out/....../img/  -type d`; do
  for i in $D/*.{jpg,jpeg,png,JPG,JPEG,PNG} ;do
    if [ ! -f "${i%.*}.webp" ]; then
        cwebp "$i" -o "${i%.*}.webp";
    fi
  done;
done;

for D in `find /var/www/share/...../source/out/pictures/{generated,ddmedia}  -type d`; do
  for i in $D/*.{jpg,jpeg,png,JPG,JPEG,PNG} ;do
    if [ ! -f "${i%.*}.webp" ]; then
        cwebp "$i" -o "${i%.*}.webp";
    fi
  done;
done;

die “…” sind entsprechend anzupassen. Und jetzt nen Cronjob drumrum und ihr habt konsequent webp-Pendants. (Voraussetzung ist natürlich das installierte Paket webp)

[mws_1941]

Es gibt dort sogar noch effizientere Methoden. Ich nutze für z.B. die Generierung der unterschiedlichen Theme Bildformate keinerlei OXID Funktionen mehr.
Wenn ein Bild hochgeladen wird, werden automatisch alle benötigten abhängigen Grössen und Formate gerendert und gespeichert.
Gruss
Marcel

[gaertnermarkus]

Da die vorherigen Befehle oft unnötige und doppelten webp-Dateien erzeugen hier meine Version mit convert:

for D in `find . -type f -iname "*.jp*g" -or -iname "*.png"`;do convert $D ${D%.*}.webp; done;

Und wenn es notwendig ist: die webp-Dateien wieder löschen:
find ./ -name ‘*.webp’ -exec rm -rv {} ;