Tagged: 

Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • February 3, 2018 at 7:10 pm #907262
    conflock

    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, 10 months ago by conflock.
    February 4, 2018 at 11:57 am #907467
    Rikard

    Hey convecto,

    Maybe this will help you out? https://wpcolt.com/webp-images-in-wordpress/

    Best regards,
    Rikard

    February 4, 2018 at 3:19 pm #907539
    conflock

    Hey 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 #907750
    Victoria

    Hi Julian,

    Could you please give us a link to your website, we need more context to be able to help you.

    Best regards,
    Victoria

    February 5, 2018 at 3:48 pm #908052
    conflock

    Hey 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, 10 months ago by conflock.
    February 6, 2018 at 10:38 am #908450
    Victoria

    Hi 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,
    Victoria

    June 12, 2020 at 12:10 am #1221912
    JS-at-Envato

    Hi,
    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, 6 months ago by JS-at-Envato.
    June 12, 2020 at 9:03 am #1221973
    Guenni007

    can 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, 6 months ago by Guenni007.
    June 12, 2020 at 9:40 pm #1222184
    JS-at-Envato

    Thanks Guenni007! It works perfect, just like you described.
    Many thanks!
    Jan

    June 13, 2020 at 6:47 am #1222304
    Jordan Shannon

    Hey JS-at-Envato,

    I’m glad this was resolved for you!

    Best regards,
    Jordan Shannon

    September 11, 2020 at 12:53 pm #1245113
    Jan Thiel

    Hey @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 #1245381
    Victoria

    Hi Jan,

    No, it has not been added yet. I will ask the devs for their input.

    Best regards,
    Victoria

    September 12, 2020 at 5:40 pm #1245392
    Günter

    Hey!

    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ünter

    February 25, 2021 at 7:17 pm #1283738
    Sandy

    I am looking forward to this function being added to Enfold!

    February 25, 2021 at 8:19 pm #1283746
    Guenni007

    well the a[href*=".webp"] is allready included to 4.8.0-dev-6 but the a[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 #1283747
    Sandy

    Thank you.

  • Author
    Posts
Viewing 16 posts - 1 through 16 (of 16 total)
  • You must be logged in to reply to this topic.