我忙于Wordpress主题，在一些模板中我使用图像（如home.php). 我计算srcset 和sizes 对于每个模板/图像，分别存储URL和变量中的值。
不可能有“一刀切”的渲染方法srcset 和sizes, 所以试图覆盖sizes 和srcset like this 这是不可能的。例如，有可能是首页中的第一幅特色图片。php的大小与第二个特征图像不同。
我的代码如下：
<div class="amb-home-post-preview thumbnail_container override">
<img alt="<?php esc_attr( the_title() ); ?>" class="amb-home-post-preview thumbnail override"
src="<?php echo esc_url( $amb_post_preview_image_1000[0] ); ?>"
srcset="
<?php echo esc_url( $amb_post_preview_image_400[0] ); ?> 400w,
<?php echo esc_url( $amb_post_preview_image_600[0] ); ?> 600w,
<?php echo esc_url( $amb_post_preview_image_800[0] ); ?> 800w,
<?php echo esc_url( $amb_post_preview_image_1000[0] ); ?> 1000w,
<?php echo esc_url( $amb_post_preview_image_1400[0] ); ?> 1400w,
<?php echo esc_url( $amb_post_preview_image_1800[0] ); ?> 1800w,
<?php echo esc_url( $amb_post_preview_image_2200[0] ); ?> 2200w,
<?php echo esc_url( $amb_post_preview_image_2600[0] ); ?> 2600w,
<?php echo esc_url( $amb_post_preview_image_3000[0] ); ?> 3000w
"
sizes="<?php foreach ($amb_sizes as $amb_key => $amb_val) { echo esc_html( $amb_val ); } ?>">
</div>
图像URL是在上面检索的（我跳过了这一部分），但它相当容易理解。这个
$amb_key 变量是媒体查询和
$amb_val 变量是宽度（例如。
calc(50vw - 36px).
结果是Wordpress跳过了完整的<img> 标记并将其替换为自己的标记。类和所有其他属性将丢失。
这种情况在不同的模板文件中多次发生。如何阻止Wordpress完全重写<img> 标记（在模板文件中）？
非常感谢！
发生这种情况的地方之一是搜索。php模板。
<?php get_header() ?>
<div class="amb-search override">
<div class="amb-search-intro override">
<div class="amb-search-editor-wrapper amb-container-parent override">
<div class="amb-search-editor amb-container-child override">
<p class="amb-search-prefix"><?php echo esc_html( get_theme_mod( \'amb_search_results_prefix\', \'Search for articles, pages...\') ); ?> </p>
</div>
<div class="amb-search-form-container amb-container-child override">
<form role="search" method="get" class="amb-search-form search_results override" action="<?php echo esc_url( home_url( \'/\' ) ); ?>">
<label>
<input type="search" class="amb-search-field search_results override" id="amb-search-field-input-search_results"
placeholder="<?php echo esc_attr( get_theme_mod( \'amb_text_searchfield\', \'Start typing...\' ) ); ?>"
value="<?php echo esc_attr( get_query_var(\'s\') ); ?>" name="s"
title="<?php echo esc_attr( get_theme_mod( \'amb_title_searchfield\', \'Search for pages, articles and documents.\' ) ); ?>"
autocomplete="off" />
</label>
<input type="submit" class="amb-search-submit header_search override"
value="" />
</form>
</div>
</div>
</div>
<div class="amb-search-results override">
<div class="amb-search-results-wrapper amb-container-parent override">
<div class="amb-search-results-wrapper amb-container-child small_child_margin override">
<!-- Looping through the search results -->
<?php
//Define the variables
$amb_home_readmore_excerpt_length = get_theme_mod( \'amb_home_readmore_excerpt_length\', 20 );
$amb_s = get_search_query(); //Get the query
$amb_s_args = array( \'s\' => $amb_s ); //...and put it into an array with argumens
$amb_search_query = new WP_Query( $amb_s_args ); //Run a new instance of WP_QUery
//Displaying the files
if ( $amb_search_query->have_posts() ) {
while ( $amb_search_query->have_posts() ) {
$amb_search_query->the_post(); ?>
<div class="amb-home-post-single post_preview_search override">
<div class="amb-home-post-contents post_preview_search override">
<!-- Thumbnail image -->
<?php if ( the_post_thumbnail() ) : ?> <!-- Check if it exists -->
<?php
$amb_post_preview_image_400 = wp_get_attachment_image_src( get_post_thumbnail_id(), \'amb_post_preview_400\');
$amb_post_preview_image_600 = wp_get_attachment_image_src( get_post_thumbnail_id(), \'amb_post_preview_600\');
$amb_post_preview_image_800 = wp_get_attachment_image_src( get_post_thumbnail_id(), \'amb_post_preview_800\');
$amb_post_preview_image_1000 = wp_get_attachment_image_src( get_post_thumbnail_id(), \'amb_post_preview_1000\'); //Default src
$amb_post_preview_image_1400 = wp_get_attachment_image_src( get_post_thumbnail_id(), \'amb_post_preview_1400\');
$amb_post_preview_image_1800 = wp_get_attachment_image_src( get_post_thumbnail_id(), \'amb_post_preview_1800\');
$amb_post_preview_image_2200 = wp_get_attachment_image_src( get_post_thumbnail_id(), \'amb_post_preview_2200\');
$amb_post_preview_image_2600 = wp_get_attachment_image_src( get_post_thumbnail_id(), \'amb_post_preview_2600\');
$amb_post_preview_image_3000 = wp_get_attachment_image_src( get_post_thumbnail_id(), \'amb_post_preview_3000\');
//Max-width if site
$amb_site_maxwidth_cust = get_theme_mod( \'amb_sitewide_layout_maxwidth\', 1320 );
$amb_site_maxwidth_cont = $amb_site_maxwidth_cust + 2 * 12;
//width of sidebar
$amb_sidebar_width = 0; //search so there is no width
//Posts per row
if ( \'one\' == get_theme_mod( \'amb_home_readmore_posts_columns\', \'two\' ) ) {
$amb_posts_per_row = 1;
} elseif ( \'two\' == get_theme_mod( \'amb_home_readmore_posts_columns\', \'two\' ) ) {
$amb_posts_per_row = 2;
} elseif ( \'three\' == get_theme_mod( \'amb_home_readmore_posts_columns\', \'two\' ) ) {
$amb_posts_per_row = 3;
} else {
$amb_posts_per_row = 4;
}
//Site max-width media query
$amb_site_maxwidth_browser = $amb_site_maxwidth_cont + 2 * 24;
$amb_min_maxwidth_a = ($amb_site_maxwidth_cont * (1 - $amb_sidebar_width)) / $amb_posts_per_row - 2 * 12;
$amb_min_maxwidth_value = \'(min-width: \' . $amb_site_maxwidth_browser . \'px) \' . $amb_min_maxwidth_a . \'px, \';
$amb_min_maxwidth_key = \'amb_min_\' . $amb_site_maxwidth_browser;
$amb_min_maxwidth_array = [
$amb_min_maxwidth_key => $amb_min_maxwidth_value
];
// 1200+
if ($amb_posts_per_row == 4) {
$amb_min_1200_r = (100 * (1 - $amb_sidebar_width)) / $amb_posts_per_row;
$amb_min_1200_a = (-48 * (1 - $amb_sidebar_width)) / $amb_posts_per_row - 24;
$amb_min_ppr_4_sizes = \'(min-width: 1200px) calc(\'.$amb_min_1200_r.\'vw + \'.$amb_min_1200_a.\'px), \'; //Generate the media query.
$amb_min_1200_4 = [
\'amb_min_1200\' => $amb_min_ppr_4_sizes
];
$amb_posts_per_row = 2; //Set to \'2\' for the following media queries
} else { $amb_min_1200_4 = \'\'; }
// 1000+
$amb_min_1000_r = (100 * (1 - $amb_sidebar_width)) / $amb_posts_per_row;
$amb_min_1000_a = (-48 * (1 - $amb_sidebar_width)) / $amb_posts_per_row - 24;
$amb_min_1000 = \'(min-width: 1000px) calc(\'.$amb_min_1000_r.\'vw + \'. $amb_min_1000_a .\'px), \'; //Including comma and space
// 700+
$amb_min_700_r = 100 / $amb_posts_per_row;
$amb_min_700_a = -48 / $amb_posts_per_row - 24;
$amb_min_700 = \'(min-width: 700px) calc(\'.$amb_min_700_r.\'vw + \'. $amb_min_700_a .\'px), \';
// all
$amb_min_all_r = 100;
$amb_min_all_a = -24 - 24; //Margin of 2 * 12 on both sides plus margin of 2 * 12 on both sides of individual post
$amb_min_all = \'calc(\'.$amb_min_all_r.\'vw + \'.$amb_min_all_a.\'px)\';
$amb_min_array_constant = [ //append \'all\' later on
\'amb_min_1000\' => $amb_min_1000,
\'amb_min_700\' => $amb_min_700,
];
//Merge default + 1200+ + max-width array
$amb_sizes_merged = array_merge( array_merge( (array)$amb_min_array_constant, (array)$amb_min_1200_4), /* combine default & 1200+ */ $amb_min_maxwidth_array/* Combine the max-width */);
//Sort the array \'naturally\' (how humans would sort it = count) and reverse the order (biggest first, smallest last) and append the \'all\' value to the end
natsort($amb_sizes_merged);
$amb_sizes_merged_reverse = array_reverse($amb_sizes_merged, true);
$amb_sizes_merged_reverse[\'amb_min_all\'] = $amb_min_all;
//Find the position of the key for the max-width and remove all values above (so \'slicing\' the array)
$amb_min_maxwidth_key_offset = array_search($amb_min_maxwidth_key, array_keys($amb_sizes_merged_reverse), true);
if ($amb_min_maxwidth_key_offset !== false) { $amb_sizes = array_slice($amb_sizes_merged_reverse, $amb_min_maxwidth_key_offset, 1000, true); }
?>
<div class="amb-home-post-preview post_preview_search thumbnail_container override">
<img alt="<?php the_title(); ?>" class="amb-home-post-preview post_preview_search thumbnail override"
src="<?php echo esc_url( $amb_post_preview_image_1000[0] ); ?>"
srcset="
<?php echo esc_url( $amb_post_preview_image_400[0] ); ?> 400w,
<?php echo esc_url( $amb_post_preview_image_600[0] ); ?> 600w,
<?php echo esc_url( $amb_post_preview_image_800[0] ); ?> 800w,
<?php echo esc_url( $amb_post_preview_image_1000[0] ); ?> 1000w,
<?php echo esc_url( $amb_post_preview_image_1400[0] ); ?> 1400w,
<?php echo esc_url( $amb_post_preview_image_1800[0] ); ?> 1800w,
<?php echo esc_url( $amb_post_preview_image_2200[0] ); ?> 2200w,
<?php echo esc_url( $amb_post_preview_image_2600[0] ); ?> 2600w,
<?php echo esc_url( $amb_post_preview_image_3000[0] ); ?> 3000w
"
sizes="<?php foreach ($amb_sizes as $amb_key => $amb_val) { echo esc_attr( $amb_val ); } ?>">
</div> <?php endif; ?>
<!-- Title -->
<h2 class="amb-home-post-preview post_preview_search title override"><a href="<?php esc_url( the_permalink() ); ?>" style="color: <?php echo esc_attr( $amb_home_readmore_section[\'category_post_text_color\'] ); ?>"><?php esc_html( the_title() ); ?></a></h2>
<!-- Excerpt -->
<div class="amb-home-post-preview post_preview_search excerpt content override" style="color: <?php echo esc_attr( $amb_home_readmore_section[\'category_post_text_color\'] ); ?>"><?php echo esc_html( wp_trim_words( get_the_content(), $amb_home_readmore_excerpt_length, \'...\' ) ); ?></div>
</div>
</div>
<?php }
} else { ?>
<div class="amb-search-noresults override">
<p class="amb-search-noresults-text"><?php echo esc_html( get_theme_mod( \'amb_search_results_noresults_text\', \'Sorry, but nothing matched your search criteria. Please try again with some different keywords.\') ); ?></p>
</div>
<?php } ?>
</div>
</div>
</div>
</div>
<?php get_footer() ?>
