Exclude Optimole URLs from Schema Images

[KingGrizzly]

What problem does this address?

Images referenced inside of schema markup (for example, rich product snippets) typically send the Optimole image URL to the search engines, not the clean, local URL.

For example:
https://mlyqxds8ijge.i.optimole.com/w:2048/h:1152/q:80/f:best/https://some-site.com/wp-content/uploads/image.jpg

Instead of:
https://some-site.com/wp-content/uploads/image.jpg

What is your proposed solution?

It would be ideal if Optimole could optionally exclude the images referenced inside of the schema markup so they get a normal URL and not the Optimole URL. Basically, I think we want the option to excluded images inside of script tags, or script tags with an ID or class:

<script id="website-schema" type="application/ld+json">...schema content...</script>

Will this feature require documentation? (Optional)

None

[ineagu]

Something we might need to keep in mind here if we want to do this is to make sure we use the original thumbnail size.

[KingGrizzly]

@ineagu Something to watch out for: some users deregister all Wordpress image sizes because Optimole does the image sizing work. This is so Wordpress won't generate a bloated uploads folder, but then there won't be a thumbnail size.

A combination of something like the following:

// Remove default WordPress image sizes
function remove_default_image_sizes( $sizes ) {
    unset( $sizes['thumbnail'] );
    unset( $sizes['medium'] );
    unset( $sizes['medium_large'] );
    unset( $sizes['large'] );
    unset( $sizes['1536x1536'] );
    unset( $sizes['2048x2048'] );

    return $sizes;
}
add_filter( 'intermediate_image_sizes_advanced', 'remove_default_image_sizes' );

// Disable srcset and sizes attributes on images
add_filter( 'wp_calculate_image_srcset', '__return_false' );
add_filter( 'wp_calculate_image_sizes', '__return_false' );
add_filter( 'wp_image_srcset_generation_enabled', '__return_false' );

// Set big image size threshold
add_filter( 'big_image_size_threshold', function() { return 3000; } );

// Optionally remove original large images after resizing
add_filter( 'wp_generate_attachment_metadata', function( $metadata ) {
    if ( isset( $metadata['file'] ) && isset( $metadata['original_image'] ) ) {
        $uploads_dir = wp_upload_dir();
        $original_image = path_join( $uploads_dir['basedir'], $metadata['original_image'] );
        if ( file_exists( $original_image ) ) {
            unlink( $original_image );
        }
    }
    return $metadata;
} );

[Soare-Robert-Daniel]

Should this compatibility be done with Jetpack and Rank Math?

[ineagu]

@Soare-Robert-Daniel what do you mean? should work no matter which plugin created the schema.

[Soare-Robert-Daniel]

@ineagu generation of that schema is not native to WP. Each plugin has its own way to generate it.

For Rank Math, they have a special filter called 'rank_math/json_ld' and they print that directly on the page. To disable the replacement tag, we need to add a compatibility filter to disable the replacement (if it is not offloading) when Rank creates that schema.

The same thing can apply to other plugins.

Code reference: https://github.com/rankmath/seo-by-rank-math/blob/b27aa991871a1fbdc4599076af801d660f90a205/includes/modules/schema/class-jsonld.php#L131-L163

Note

Not sure if we can develop a solution (with good performance) where we scan the final page output for json-ld and apply those changes. Thus making it plugin-agnostic.

[ineagu]

I see what you mean, I somehow thought it looks at the final page and can check json-ld.

I think we can start with compatibility with yoast, rankmath and jetpack

[KingGrizzly]

@ineagu I'd vote for SEOPress too. :-)