Php WordPress：使用<；图片>-用wp\u get\u附件\u图像标记

我想将

-标记与功能

wp\u get\u attachment\u image

一起使用。 现在我得到了一个

。这很好，但是有没有办法将其更改为包含多个源的
-标记？像这样：

<picture>
  <source media="(min-width: 56.25em)" srcset="large.jpg 1x, large@2x.jpg 2x">
  <source media="(min-width: 37.5em)" srcset="medium.jpg 1x, medium@2x.jpg 2x">
  <source srcset="small.jpg 1x, small@2x.jpg 2x">
  <img src="fallback.jpg" alt="">
</picture>

<picture>
  <source media="(min-width: 38em)" srcset="art-direction-horizontal.jpg">
  <source srcset="art-direction-vertical.jpg">
  <img src="art-direction-vertical.jpg" alt="">
</picture>



我需要它，因为我想显示图像的第二个版本。因此，我可以在一个
-标记中显示水平和垂直图像。像这样：

<picture>
  <source media="(min-width: 56.25em)" srcset="large.jpg 1x, large@2x.jpg 2x">
  <source media="(min-width: 37.5em)" srcset="medium.jpg 1x, medium@2x.jpg 2x">
  <source srcset="small.jpg 1x, small@2x.jpg 2x">
  <img src="fallback.jpg" alt="">
</picture>

<picture>
  <source media="(min-width: 38em)" srcset="art-direction-horizontal.jpg">
  <source srcset="art-direction-vertical.jpg">
  <img src="art-direction-vertical.jpg" alt="">
</picture>

自5.6.0以来，我们有了一种包装img元素的方法

apply_filters( 'wp_get_attachment_image', $html, $attachment_id, $size, $icon, $attr );

过滤器不提取post_id，而是提取附件id。因此，如果您想系统地激活该功能，您应该通过post meta链接附件及其移动图像

function wrap_wp_get_attachment_image_with_picture_tag( $html, $attachment_id, $size, $icon, $attr ){
    if ( is_admin() || $size == 'medium' || $size == 'thumbnail' ) return $html;
    if ( $mobile_id = get_post_meta( $attachment_id, '_meta_key_of_mobile_picuture_id', true ) ){
        $mobile_srcset = wp_get_attachment_image_srcset( $mobile_id, 'medium_large' );
        $html = '<picture><source media="( max-width : 782px )" srcset="'.$mobile_srcset.'">'.$html.'</picture>';
    }
    return $html;
}
add_filter( 'wp_get_attachment_image', 'wrap_wp_get_attachment_image_with_picture_tag', 10, 5 );

function wrap\u wp\u get\u attachment\u image\u带有图片标签（$html、$attachment\u id、$size、$icon、$attr）{
如果（is_admin（）| |$size=='medium'| |$size=='thumbnail'）返回$html；
如果（$mobile_id=get_post_meta（$attachment_id，''u meta_key_of_mobile_picture_id'，true））{
$mobile_srcset=wp_get_attachment_image_srcset（$mobile_id，'medium_large'）；
$html='.$html'.'；
}
返回$html；
}
添加过滤器（'wp\u get\u attachment\u image'，'wrap\u wp\u get\u attachment\u image\u with\u picture\u tag'，10,5）；
无法修改
wp\u get\u attachment\u image的输出；你需要自己设计一个函数。不过，您可以使用现有的帮助。您可以使用init钩子中的（
add\u action（'init'，'override\wp\u get\u attachment\u image'）
）来实现这一点。但由于这是一个调试组件，您可能不希望在生产环境中运行此扩展。另一种（黑客）方法可能是修补
wp-includes/media.php
。但再一次，可能不是你们想在产品上做的事情。然后再一次，WP并没有给你们留下任何干净的选择。