وبلاگ

اضافه کردن Lazy Loading به تصاویر وردپرس / قسمت پایانی

در قسمت ۱ نحوه اضافه کردن بارگزاری تنبل با جی کوئری نوشتیم و حالا می خواهیم بدون افزونه با تابع ویژگی بارگذاری تنبل به تصاویر وردپرس اضافه کنیم.

کافیه کد زیر به فایل functions.php وارد کنید.

add_filter( 'the_content', 'roka_lazy_load_images' );
function roka_lazy_load_images( $content ) {

    if ( is_singular() && in_the_loop() && is_main_query() ) {
        $content = preg_replace_callback( '/<img[^>]+>/', function( $matches ) {

            if( false === strpos( $matches[ 0 ], 'loading=' ) ) {
                $matches[ 0 ] = str_replace( '<img', '<img loading="lazy"', $matches[ 0 ] );
            }

            return $matches[ 0 ];

        }, $content );
    }

    return $content;
}

پایان