Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

WebP support #365

Open
thomashup opened this issue Apr 17, 2022 · 3 comments
Open

WebP support #365

thomashup opened this issue Apr 17, 2022 · 3 comments

Comments

@thomashup
Copy link

Hello

Im using this plugin with much joy, but i really miss the WebP support.

Has anyone figured out how to serve WebP images, or does it require an update of the plugin?

@acwolff
Copy link

acwolff commented Apr 17, 2022

It works with WebP images without problems as you can see in this test album: https://andrewolff.jalbum.net/PS_JustifiedGallery_white/

@thomashup
Copy link
Author

Thanks for the quick reply.

Changing the img url to WebP can be a way of changing it, but if the page is rendered in a older browser that doesn't support WebP, my guess is that nothing is shown.

In HTML there's a fallback solution like this:

<picture>
  <source srcset="img/awesomeWebPImage.webp" type="image/webp">
  <source srcset="img/creakyOldJPEG.jpg" type="image/jpeg"> 
  <img src="img/creakyOldJPEG.jpg" alt="Alt Text!">
</picture>

It's something like this, that would be nice if was possible.

@acwolff
Copy link

acwolff commented Apr 17, 2022

Yes I can use also a jpg fallback, see here: https://andrewolff.jalbum.net/PS_JustifiedGallery_white/

I use this code:

<a id="s0" href= "slides/Vecht_121027_1156.jpg" data-pswp-width="1440" data-pswp-height="1080" data-pswp-srcset="slides/Vecht_121027_1156-1440w.webp 1440w,slides/Vecht_121027_1156.jpg 1440w,slides/Vecht_121027_1156-720w.webp 720w" data-caption='Start aan de Grote Esweg.'>
<img srcset="thumbs/Vecht_121027_1156-427w.webp 427w,thumbs/Vecht_121027_1156.jpg 427w" src="thumbs/Vecht_121027_1156.jpg"width="213" height="160" alt="1: Vecht_121027_1156<br>Start aan de Grote Esweg." title="1: Vecht_121027_1156<br>Start aan de Grote Esweg." />
</a>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants