WebP

If you are using Nginx, then make sure your configuration is as follow:

"Proxy mode" must be ON, other options must be OFF.

Se dopo l'installazione del modulo non vengono più visualizzate alcune immagini del negozio, come il logo, le immagini delle pagine CMS, le immagini del back office, ecc. Questo file blocca qualsiasi script PHP, anche se si tratta di un reindirizzamento (lo script non si trova realmente in questa directory).

Per correggere questo problema è necessario rinominare il file /img/.htaccess in /img/.htaccess.off

Sì, tutte le immagini del vostro negozio saranno automaticamente convertite nel formato WEBP. Anche le immagini del CMS o di altri moduli come il blog.

Sì, avete ancora bisogno di un modulo WEBP per Prestashop! Perché la funzione ha un bug in PS 8.0. Dovrebbe essere risolto in PS 8.1, ma lo verificherò non appena sarà rilasciato perché non so se le immagini JPG saranno visualizzate dai browser che non possono leggere il formato WEBP come Safari (iPhone).

È stato molto difficile trovare una configurazione che funzionasse bene. Non sono esperto nella configurazione di nginx, quindi immagino che ci sia un altro modo per farlo. Se volete migliorare questa configurazione contattatemi, sarò felice di aggiornare questo post per aiutare altre persone!

Ecco la mia soluzione (siate gentili).

Prima della sezione "server", inserire questo codice:

map $http_accept $webp_enable {
	default 0;
	"~*webp" 1;
}

Ci dirà se il browser del visitatore può leggere le immagini WEBP.

Probabilmente avete più righe di "rewrite" per tutte le immagini, inserite il seguente codice subito prima:

# Jpresta Speedpack
if ($webp_enable = 1) {
	# Rewrite images URL using a specific extension ".webp_compressor" so we can have specific rules to compress the image/svg
	# if the webp file is not already created.
	rewrite "^/c/([0-9]+)(\-[_a-zA-Z0-9-]*)/(.*)\.jpg$" /img/c/$1$2.webp_compressor last;
	rewrite "^/c/([_a-zA-Z-]+)/(.*)\.jpg$" /img/c/$1.webp_compressor last;
	rewrite "^/([0-9])(\-[_a-zA-Z0-9-]*)?/(\P{M}\p{M}*)*\.jpg$" /img/p/$1/$1$2.webp_compressor last;
	rewrite "^/([0-9])([0-9])(\-[_a-zA-Z0-9-]*)?/(\P{M}\p{M}*)*\.jpg$" /img/p/$1/$2/$1$2$3.webp_compressor last;
	rewrite "^/([0-9])([0-9])([0-9])(\-[_a-zA-Z0-9-]*)?/(\P{M}\p{M}*)*\.jpg$" /img/p/$1/$2/$3/$1$2$3$4.webp_compressor last;
	rewrite "^/([0-9])([0-9])([0-9])([0-9])(\-[_a-zA-Z0-9-]*)?/(\P{M}\p{M}*)*\.jpg$" /img/p/$1/$2/$3/$4/$1$2$3$4$5.webp_compressor last;
	rewrite "^/([0-9])([0-9])([0-9])([0-9])([0-9])(\-[_a-zA-Z0-9-]*)?/(\P{M}\p{M}*)*\.jpg$" /img/p/$1/$2/$3/$4/$5/$1$2$3$4$5$6.webp_compressor last;
	rewrite "^/([0-9])([0-9])([0-9])([0-9])([0-9])([0-9])(\-[_a-zA-Z0-9-]*)?/(\P{M}\p{M}*)*\.jpg$" /img/p/$1/$2/$3/$4/$5/$6/$1$2$3$4$5$6$7.webp_compressor last;
	rewrite "^/([0-9])([0-9])([0-9])([0-9])([0-9])([0-9])([0-9])(\-[_a-zA-Z0-9-]*)?/(\P{M}\p{M}*)*\.jpg$" /img/p/$1/$2/$3/$4/$5/$6/$7/$1$2$3$4$5$6$7$8.webp_compressor last;
	rewrite "^/([0-9])([0-9])([0-9])([0-9])([0-9])([0-9])([0-9])([0-9])(\-[_a-zA-Z0-9-]*)?/(\P{M}\p{M}*)*\.jpg$" /img/p/$1/$2/$3/$4/$5/$6/$7/$8/$1$2$3$4$5$6$7$8$9.webp_compressor last;  
	# all other images
	rewrite "^(.+)\.jpg$" $1.webp_compressor last;   
}

location ~* ^(.+)\.webp_compressor$ {
	# Indicates to proxies that the file content/format depends (Vary) on the "Accept" header
	add_header Vary Accept;

	# Indicates to proxies that the file can be cached for the max duration
	add_header Pragma public;
	add_header Cache-Control "public, must-revalidate, proxy-revalidate";
	expires max;

	# Indicates to nginx not to log access
	access_log off;
	log_not_found off;

	# Try to serve the WEBP file directly or compress the image
	set $url_webp_compressor "/modules/jprestaspeedpack/controllers/front/webp.php?src=$1.jpg";
	try_files $1.webp $url_webp_compressor;
}

ATTENZIONE: se si utilizza il modulo di compressione WEBP autonomo, è necessario sostituire 'jprestaspeedpack' con 'jprestawebp'.

Contattatemi se avete bisogno di aiuto o se potete migliorare lo script!

sì, i browser che non possono leggere il formato WEBP otterranno il formato originale (JPG/PNG).

Il modulo non chiama l'hook che consente l'aggiornamento.

È necessario modificare la funzione imageResize() nel file /modules/prestablog/prestablog.php:

Sostituire questo

         return ImageManager::write('jpg', $dest_image, $file_after);

Con questo

         $ret = ImageManager::write('jpg', $dest_image, $file_after);

 Hook::exec('actionOnImageResizeAfter', ['dst_file' => $file_after, 'file_type' => 'jpg']);

 return $ret;

in seguito le immagini saranno aggiornate.

No, il modulo converte solo immagini JPG/PNG in formato WEBP. Si consiglia di importare le immagini come JPG perché alcuni browser ancora non possono caricare file WEBP. Inoltre, penso che i JPG siano migliori come immagini originali perché Prestashop crea più formati/dimensioni di immagini, motivo per cui l'immagine originale deve essere di buona qualità.