Tagged: 

Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #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, 1 month ago by conflock.
    #907467

    Hey convecto,

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

    Best regards,
    Rikard

    #907539

    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

    #907750

    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

    #908052

    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 ago by conflock.
    #908450

    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

    #1221912

    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 3 years, 8 months ago by JS-at-Envato.
    #1221973

    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 3 years, 8 months ago by Guenni007.
    #1222184

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

    #1222304

    Hey JS-at-Envato,

    I’m glad this was resolved for you!

    Best regards,
    Jordan Shannon

    #1245113

    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

    #1245381

    Hi Jan,

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

    Best regards,
    Victoria

    #1245392

    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

    #1283738

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

    #1283746

    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.

    #1283747

    Thank you.

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