Tagged: WebP
-
AuthorPosts
-
February 3, 2018 at 7:10 pm #907262
We’re using the Optimus image compression plugin together with the cache enabler. There’s an option to user WebP images instead of JPG. It works great with Enfold except with the image gallery lightbox scripts. I guess there’s a javascript which checks for JPG and PNG images but not for WebP images. Is there a solution? Can I enhance the script in my child theme so that I don’t need to change it after an upgrade.
My wish would be to add WebP to that script in your code in general in the next Enfold version, because Optimus with WebP really brings huge speed improvements to websites with many big images.
Thanks in advance.
- This topic was modified 6 years, 9 months ago by conflock.
February 4, 2018 at 11:57 am #907467Hey convecto,
Maybe this will help you out? https://wpcolt.com/webp-images-in-wordpress/
Best regards,
RikardFebruary 4, 2018 at 3:19 pm #907539Hey Rikard,
sorry, but did you even read my question? I don’t have problems using WebP images in WP in general but with the Enfold image gallery lightbox module. I can’t see any context with my question in your answer.
cheers, Julian
February 5, 2018 at 6:28 am #907750Hi Julian,
Could you please give us a link to your website, we need more context to be able to help you.
Best regards,
VictoriaFebruary 5, 2018 at 3:48 pm #908052Hey Victoria,
see link in private section. I deactivated WebP at the moment because lightbox script in the page “Über uns” didn’t worked. When I used WebP the images opened without lightbox effect. I think the file extension .webp is missing in the lightbox script.
Thanks for your help.
Best Regards, Julian
- This reply was modified 6 years, 9 months ago by conflock.
February 6, 2018 at 10:38 am #908450Hi Julian,
Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?
Can you enable the plugin and make a test page for us?
Best regards,
VictoriaJune 12, 2020 at 12:10 am #1221912Hi,
as suggested in this thread (https://kriesi.at/support/topic/proposal-for-improvement-of-the-lightbox-script/), .webp extension is missing.
I looked into the mentioned file (themes/enfold/js/avia-snipped-lightbox.js) and I think, in the most current version, it has to be added in line 151.
Is it possible to place this file into the child-theme and change it there?
Best regards,
Jan
Edit: If I change the mentioned line to this:
autolinkElements: ‘a.lightbox, a[rel^=”prettyPhoto”], a[rel^=”lightbox”], a[href$=jpg], a[href$=png], a[href$=gif], a[href$=jpeg], a[href$=webp], a[href*=”.jpg?”], a[href*=”.png?”], a[href*=”.gif?”], a[href*=”.jpeg?”], a[href$=”.mov”] , a[href$=”.swf”] , a:regex(href, .vimeo\.com/[0-9]) , a[href*=”youtube.com/watch”] , a[href*=”screenr.com”], a[href*=”iframe=true”]’,
Then the lightbox is working fine with webp.- This reply was modified 4 years, 5 months ago by JS-at-Envato.
June 12, 2020 at 9:03 am #1221973can you try this in your child-theme functions.php:
and upload the edited file to your child-theme/js/ folder ( on default there is no folder js – create one )
( although in this case it would not be necessary to use the folder structure of the parent theme i think it looks more logical. )add_action( 'wp_enqueue_scripts', 'wp_change_lightbox_script', 100 ); function wp_change_lightbox_script() { wp_deregister_script( 'avia-lightbox-activation' ); wp_enqueue_script( 'avia-lightbox-activation-child', get_stylesheet_directory_uri().'/js/avia-snippet-lightbox.js', array('avia-default'), $vn, true); }
PS: do not forget to include:
a[href*=".webp?"]
– similar to their syntax.but i believe that the asterisk selector
a[href*=".webp"]
will be enough and includes :a[href$=webp]
- This reply was modified 4 years, 5 months ago by Guenni007.
June 12, 2020 at 9:40 pm #1222184Thanks Guenni007! It works perfect, just like you described.
Many thanks!
JanJune 13, 2020 at 6:47 am #1222304Hey JS-at-Envato,
I’m glad this was resolved for you!
Best regards,
Jordan ShannonSeptember 11, 2020 at 12:53 pm #1245113Hey @jordan_s @Guenni007
will or is this fix already included in Enfold Core? I couldn’t find anything in the recent changelogs.
Thanks an best regards,
Jan
September 12, 2020 at 5:19 pm #1245381Hi Jan,
No, it has not been added yet. I will ask the devs for their input.
Best regards,
VictoriaSeptember 12, 2020 at 5:40 pm #1245392Hey!
Thanks a lot for your input.
We will add it to core – I opened an issue in our dev repo – but I’m not sure if we will be in the next release. Please check the changelog.
Cheers!
GünterFebruary 25, 2021 at 7:17 pm #1283738I am looking forward to this function being added to Enfold!
February 25, 2021 at 8:19 pm #1283746well the
a[href*=".webp"]
is allready included to 4.8.0-dev-6 but thea[href*=".webp?"]
is missing – so wait til next update and change it on your parent theme file : avia-snippet-lightbox.js yourself without the child-theme construct from above and the next update will bring it back.February 25, 2021 at 8:28 pm #1283747Thank you.
-
AuthorPosts
- You must be logged in to reply to this topic.