如何在WordPress中添加自定义srcset响应图像？

Question

首先，感谢您的阅读。我尝试搜索，但只发现过时的问题。如果已经有人问过，对不起。

我正在尝试使用自定义图像尺寸在WordPress中制作自适应图像。当前的自定义尺寸为：

add_action( 'after_setup_theme', 'wpdocs_theme_setup' );
function wpdocs_theme_setup() {
    add_image_size( 'category-thumb', 1024 );
    add_image_size( 'single-thumb', 1024, 400, true );
    add_image_size( 'homepage-thumb', 350, 350, true );
    add_image_size( 'archive-thumb', 400, 400, true );
}

add_filter( 'image_size_names_choose', 'rudr_new_image_sizes' );
function rudr_new_image_sizes( $sizes ) {

    $addsizes = array(
        "category-thumb" => 'Featured Size',
        "homepage-thumb" => 'Home Size',
        "archive-thumb"  => 'Archive Size',
        "single-thumb"  => 'Single Posts Size',
    );

    $newsizes = array_merge( $sizes, $addsizes );

    return $newsizes;

}

我如何使这些图像具有响应性？我已经尝试过Google，但是找不到解释它的教程。他们都告诉我要使用插件，但我不想这么做。我想创建一个将srcset注入所有图像的函数，具体取决于上述大小，并在浏览器变得小于上述大小时对这些做出响应。

我该怎么做？