Divi Performance: Page Speed Insights optimieren

In diesem Video zeige ich dir, wie ich die Page Speed Insights für das Theme Divi optimiere. Wir werden dazu die Bilder, den Cache und die Fonts optimieren. Ich nutze dazu folgende Plugins:

• Cache mit WP Rocket optimieren: https://link.designers-inn.de/wprocket
• Bilder mit ShortPixel optimieren: https://link.designers-inn.de/shortpixel
• Kontrolliere auch das CLS: https://youtu.be/DADMjbzFD4g

Also dann … los geht´s:

Code aus dem Video:

// SWAP IMAGE modified font-swapper //
add_action( 'init', function () {
remove_action( 'wp_enqueue_scripts', 'et_builder_preprint_font' );
});
function et_builder_preprint_font_replacement() {
// Return if this is not a post or a page
if ( ! is_singular() || ! et_core_use_google_fonts() ) {
return;
}
$post_id = get_the_ID();
$post_fonts_data = get_post_meta( $post_id, 'et_enqueued_post_fonts', true );
if ( ! is_array( $post_fonts_data ) || ! isset( $post_fonts_data['family'], $post_fonts_data['subset'] ) ) {
return;
}
$fonts = $post_fonts_data[ 'family'];
if ( ! $fonts ) {
return;
}
$unique_subsets = $post_fonts_data[ 'subset'];
$protocol = is_ssl() ? 'https' : 'http';
wp_enqueue_style( 'et-builder-googlefonts-cached', esc_url( add_query_arg( array(
'family' => implode( '|', $fonts ) ,
'subset' => implode( ',', $unique_subsets ),
'display' => 'swap',
), "$protocol://fonts.googleapis.com/css" ) ) );
}
add_action( 'wp_enqueue_scripts', 'et_builder_preprint_font_replacement', 10, 2 );
// ENDE //