We are looking to include a preload rel tag in our first image to be loaded.
LCP is high and this recommendation seems mandatory.
Is there any chance to add this to pulse pro template?
https://developers.google.com/speed/pagespeed/insights/?hl=es&url=https%3A%2F%2Fsimracer.es&tab=mobile
Try this: https://wordpress.org/plugins/preload-images/
Unfortunately, it still hasn’t completely solved my LCP problem.
Hello,
I just checked your website and seems you use Autoptimize plugin, please disable it, also if you are using a child theme or cache plugin, deactivate them, clear all cache(also from your browser) and delete the logo and add it again, and see if the problem persists.
Thank you!
First image of the post I meant, not the logo.
Is there any chance to apply a rel tag to pulse pro (or other) template to this first big block with the picture?
Hello,
Please enable this option from Theme Panel -> Template Settings -> Image loading => https://www.screencast.com/t/Iah2MDxF2E and see the results.
Thank you!
Well, that’s lazy loading, which is clearly lowering my speed and score on pagespeed (tested) anyway with that enabled, comes the problem where LCP on the first big picture appears. Should be appropriate let the user choose what element preload on templates?
Thank you for bringing this up! I’ve been trying to figure out how to Preload the homepage featured images along with the article featured image only. Google is really focusing on these aspects, and I had assumed the theme would be updated with this in mind.
I did find this code for preloading featured images and wanted to let the Newspaper developer see if it would work with this one.
It would be great to have this figured out before May hits with Google’s changes.
Thank you.
/**
* Preload attachment image, defaults to post thumbnail
*/
function preload_post_thumbnail() {
global $post;
/** Prevent preloading for specific content types or post types */
if ( ! is_singular() ) {
return;
}
/** Adjust image size based on post type or other factor. */
$image_size = 'full';
if ( is_singular( 'product' ) ) {
$image_size = 'woocommerce_single';
} else if ( is_singular( 'post' ) ) {
$image_size = 'large';
}
$image_size = apply_filters( 'preload_post_thumbnail_image_size', $image_size, $post );
/** Get post thumbnail if an attachment ID isn't specified. */
$thumbnail_id = apply_filters( 'preload_post_thumbnail_id', get_post_thumbnail_id( $post->ID ), $post );
/** Get the image */
$image = wp_get_attachment_image_src( $thumbnail_id, $image_size );
$src = '';
$additional_attr_array = array();
$additional_attr = '';
if ( $image ) {
list( $src, $width, $height ) = $image;
/**
* The following code which generates the srcset is plucked straight
* out of wp_get_attachment_image() for consistency as it's important
* that the output matches otherwise the preloading could become ineffective.
*/
$image_meta = wp_get_attachment_metadata( $thumbnail_id );
if ( is_array( $image_meta ) ) {
$size_array = array( absint( $width ), absint( $height ) );
$srcset = wp_calculate_image_srcset( $size_array, $src, $image_meta, $thumbnail_id );
$sizes = wp_calculate_image_sizes( $size_array, $src, $image_meta, $thumbnail_id );
if ( $srcset && ( $sizes || ! empty( $attr['sizes'] ) ) ) {
$additional_attr_array['imagesrcset'] = $srcset;
if ( empty( $attr['sizes'] ) ) {
$additional_attr_array['imagesizes'] = $sizes;
}
}
}
foreach ( $additional_attr_array as $name => $value ) {
$additional_attr .= "$name=" . '"' . $value . '" ';
}
} else {
/** Early exit if no image is found. */
return;
}
/** Output the link HTML tag */
printf( '<link rel="preload" as="image" href="%s" %s/>', esc_url( $src ), $additional_attr );
}
add_action( 'wp_head', 'preload_post_thumbnail' );
Hello,
@gooma2 Thank you for this information, I have forwarded these details to our developers.
@gcamara At the moment the pre-load option can be set only on the mega menu from the Cloud header template. => https://www.screencast.com/t/RLknsqVDT maybe it is a good idea to have this option on different elements, I will note on our list of suggestions.
Thank you!
It seems like there would be a way to Preload the container as it is
tdb_single_bg_featured-image
And be able to just have that done. With Google really pushing for this, I have to imagine the developer is trying to get this one right as it will affect everyone with this theme.
Hello,
I have notified the developers, and they are aware of these problems, they will look over the code sent by you and will do their best to try to solve this problem in the next update.
Thank you!
