-
Posts
-
hi
The images on my site below and have replaced my jpgs with webp files to cut down on page size, but the webp files aren’t opening in lightbox.
The first image are ther hero is a jpg and opens, but the rest are still webp and open as static images in another tab.
Can you help me with this? thanks.well i thought that webp is allready included to autolinkElements in avia-snippet-lightbox.js – there is a[href$=webp] in the list.
So what version of enfold do you run on that page? i guess it is in there since newer Enfold Versions.Hi,
Thank you for the inquiry.
Try to update theme to version 7.1.2, then toggle or temporarily disable the Enfold > Performance > File Compression settings. If the issue persists, you may need to add the “lightbox” class name (under Advanced > Developer Settings > Custom CSS Class) to the images using webp format.
Best regards,
Ismaelthe compression was disbabled, and I added the name “lightbox” to the css class on the 2 overlapping images (*now both webp) –
they open in lightbox on the preview but not on the actual page view.
can you see the lightbox on your end?
I don’t see an update to 7.1 in the theme options.thanks
NancyHi,
Thank you for the update.
What happens when you add the class name “post-entry” to the image elements? Please provide the login details in the private field so we can investigate the issue further. Also, make sure that Appearance > Theme File Editor is accessible.
Best regards,
IsmaelIn my opinion, webp makes sense if you use it as a replacement for png. If you have an image without transparency, jpg is just as good.
Hi,
Thank you for the login info.
Looks like the lightbox doesn’t support webp images. One workaround, if you really need to use a webp image and enable the lightbox, is to set the Advanced > Link Settings > Image Link? option to “Set Manually”, then place the URL of a jpg or png image in the provided link field. Let us if you need more info.
Best regards,
Ismaelon my installation it works without any problem – if you use the webp images from media-library!
https://webers-testseite.de/webp-lightbox/or: next suggestion – you are using a plugin that replaces jpgs by webp images ( f.e. from shortpixel – automatic calculation of jpgs to webp- and replacement in DOM )
As mentioned above
var defaults = { groups : ['.avia-slideshow', '.avia-gallery', '.av-horizontal-gallery', '.av-instagram-pics', '.portfolio-preview-image', '.portfolio-preview-content', '.isotope', '.post-entry', '.sidebar', '#main', '.main_menu', '.woocommerce-product-gallery'], autolinkElements : 'a.lightbox, a[rel^="prettyPhoto"], a[rel^="lightbox"], a[href$=jpg], a[href$=webp], a[href$=png], a[href$=gif], a[href$=jpeg], 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*="youtube.com/shorts"] , a[href*="screenr.com"], a[href*="iframe=true"]', videoElements : 'a[href$=".mov"] , a[href$=".swf"] , a:regex(href, .vimeo\.com/[0-9]) , a[href*="youtube.com/watch"] , a[href*="youtube.com/shorts"] , a[href*="screenr.com"], a[href*="iframe=true"]', exclude : '.noLightbox, .noLightbox a, .fakeLightbox, .lightbox-added, a[href*="dropbox.com"], .pagination a' },a[href$=webp]is an autolinkElement – so there must be something that hampers this on your installation.
- You must be logged in to reply to this topic.