PThumbTransparent WebP Images

Oh, it’s q=0.7 (vom 0 to 1) :roll_eyes:

Hi @andywizz,

Re. The q= value between 0 and 1, is this for WebP with Resizer off specifically, as I have always used values between 0 - 100 and the docuentation you linked indicate the range is the same:

“q = JPEG compression (1=worst, 95=best, 75=default)”

Just want to check before making any changes on multiple websites :slight_smile:

webp didn’t work with q=70, jpg does, pthumb created pictures with very low quality, that’s how I recognized it.
webp didn’t work with resizer on either, I had to turn it off by resizer=0
But be careful, creating WebPs is very time-consuming for the server. Taking 20 images, about 4-7 MB, generating a couple of sizes each and I had a time off!!!
Using jpgs its 0-100 of course.

Came here looking for the solution for transparent PNG to WEBP.

pthumb works just fine generating webp images, just no transparency.

You might want to check those converted webP files though.
I thought it was working because the file names ended in webP - but was confused that the files were quite large. It turned out they weren’t webP files at all - they had the extension but when I changed it manually to jpg I could open them in photoshop. They were just standard jpgs!

Unless it’s updated since I tried but worth checking the webP files are actually the correct format.

When I use inspector in Chrome the png is 436kB, the webp is 46kB.

<picture>
  <source srcset="[[!pthumb? &input=`images/frontpage/phone.png` &useResizer=`0` &options=`&f=webP&w=460`]]" type="image/webp">
  <source srcset="[[!pthumb? &input=`images/frontpage/phone.png` &useResizer=`1` &options=`&f=png&w=460`]]" type="image/png"> 
  <img class="img-responsive center-block" src="[[!pthumb? &input=`images/frontpage/phone.png` &useResizer=`1` &options=`&f=png&w=460`]]" alt="woman on phone">
</picture>

I thought for a workaround I could upload webp as my source image and convert to png for compatibility, but phpthumb fails.

The fix is to use up to date versions. I ran the same code on an update modxcloud and it worked.

PHP 7.4 has updated versions of GD and imagemagick, I think that is the fix.

1 Like

Hey @bwente

Glad you found a fix.

I take it that fixes the webP transparency, but not the webP as a source image issue?

@dejaya Yes, that is correct, the media browser does not display webP thumbnails.

1 Like

My mistake. It does work. @halftrainedharry pointed out the issue.