Support » Plugin: WebP Express » Nginx + Cloudflare + Lazy Load by WP Rocket

  • Hello,
    I have installed WebP Express and set it to append .webp to the name of the file, destination folder “mingled” and enabled Alter HTML with the option to to “Replace tags with <picture> tags, adding the webp to srcset”.
    I have converted in bulk all the images on my site (and it worked).

    I have also added the following to my nginx site config:

    	# WebP Express rules
    	# --------------------
    	location ~* ^/?wp-content/.*\.(png|jpe?g)$ {
    	  add_header Vary Accept;
    	  expires 365d;
    	  if ($http_accept !~* "webp"){
    		break;
    	  }
    	  try_files
    		/wp-content/webp-express/webp-images/doc-root/$uri.webp
    		$uri.webp
    		/wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content
    		;
    	}
    
    	# Route requests for non-existing webps to the converter
    	location ~* ^/?wp-content/.*\.(png|jpe?g)\.webp$ {
    		try_files
    		  $uri
    		  /wp-content/plugins/webp-express/wod/webp-realizer.php?wp-content=wp-content
    		  ;
    	}
    	# ------------------- (WebP Express rules ends here)

    In Cloudflare, I have set Cache to Bypass for all jpgs. I have Lazy Load by WP Rocket enabled for all images.

    Unfortunately the HTML is not altered and I always get served jpgs, even on the latest Chrome. You can check the example page. Any ideas why?

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Forgot to mentioned that I have tried both Operation modes CDN Friendly and Varied image responses… but nothing changed

    I have noticed that pages that have a posts loop (like the home page) show images in webp, but the post URL itself only shows jpgs.

    This is my single.php, maybe there’s something incompatible with how the wp query was set up here?

    <?php get_header(); ?>
    
    	<article>
    	<div id="content" role="main">
    	
    		<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    		<div class="post" id="post-<?php the_ID(); ?>">
    		<header>
    		<h1><?php the_title(); ?></h1>
    		<div class="postinfo">di <?php the_author_posts_link(); ?> - published on <?php the_time('j F Y') ?> <span class="noprint"><?php edit_post_link('Edit',' [ ',' ]'); ?></span></div> 
    		</header>
    		<div class="entry" lang="it">
    			<?php the_content() ?>
    		</div>
    		</div>
    		
    	<div id="comments">
    	<?php comments_template(); ?>
    	</div>
    
    	<?php endwhile; else: ?>
    		<p><?php _e('No posts.'); ?></p>
    	<?php endif; ?>
    
    	</div>
    	</article>
    
    	<?php get_sidebar(); ?>
    	<?php get_footer(); ?>

    Selecting “Use content filtering hooks (the_content, the_excerpt, etc)” instead of “The complete page (using output buffering)” in Alter HTML – Where to replace, made everything work

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