Documentation, Reference Materials and Tutorials for Envira Gallery
Would you like to keep using JetPack’s new lazy load feature for non-gallery images but still use Envira’s lazy load for the gallery images? This tutorial will walk you through the steps needed to use both JetPack and Envira lazy load!
To allow the JetPack filter to work on all images except Envira images, just add the following code to a new file at /wp-content/plugins/envira-jp-lazy-load-filter.php
:
<?php /* * Plugin Name: Envira Gallery - JetPack Lazy Load Filter * Plugin URI: https://enviragallery.com * Version: 1.1.0 * Author: Envira Gallery Team * Author URI: https://enviragallery.com * Description: Allowing JetPack lazy load and Envira lazy load to work in harmony */ add_filter('envira_gallery_indexable_image_css', 'jp_envira_gallery_indexable_image_css', 10, 2 ); function jp_envira_gallery_indexable_image_css( $css, $id ) { $css .= 'skip-lazy'; return $css; } add_filter('jetpack_lazy_images_blacklisted_classes', 'envira_jetpack_lazy_images_blacklisted_classes', 999, 1 ); function envira_jetpack_lazy_images_blacklisted_classes( $blacklisted_classes ) { $blacklisted_classes[] = 'envira-gallery-image'; $blacklisted_classes[] = 'skip-lazy'; return $blacklisted_classes; } /* trick Jetpack into thinking there's already a lazy load src for <noscript> images, so they don't appear */ add_filter('envira_gallery_output_noscript', 'jp_envira_gallery_output_noscript', 999, 2 ); function jp_envira_gallery_output_noscript( $html, $gallery_data ) { $html = str_replace('<img ', '<img data-lazy-src="" ', $html); return $html; }
If you’re unsure how to create a plugin file, follow these steps below:
envira-jp-lazy-load-filter.php
Your next step is to activate the plugin you just uploaded. Simply navigate to the Plugins from within your WordPress dashboard and activate the Envira Gallery – JetPack Lazy Load Filter plugin.
And that’s it! When you activate the plugin, you’ll be able to use both JetPack and Envira’s lazy load options.
If you would like to extend Envira galleries in other ways, check out this tutorial on how to How to Track Views, Shares, and Downloads of Each Gallery Image.
A: Certainly! Navigate to JetPack » Settings, under the Performance & speed you’ll have an option to turn the Enable Lazy Loading for images on or off.
A: No, currently this is only for the Envira premium licenses. We’ll update this doc when Envira Lite has this filter capability in the near future.
Envira Gallery: Create, Showcase, and Sell Your Work – Trusted by 150k+ Sites.
Enter the URL of your WordPress website to install
Unlock even more powerful features designed to make your galleries even more beaituful.
Video Galleries
eCommerce
Social media Sharing
Adobe Lightroom
And much more!
Copyright © [#this year :%Y] Envira Gallery, LLC. Envira Gallery is a trademark of Envira Gallery, LLC.