从wp_GET_ATTACH_IMAGE中删除维度

时间：2016-01-06 作者：user3756781

在使用wp\\u get\\u attachment\\u image时，我在删除附件图像的宽度和高度时遇到一些问题。这是我用来显示图像的

 <?php echo $image = wp_get_attachment_image( $entry[\'slide_image_id\'], true, \'full\'); ?>

源代码的外观

 <img width="150" height="108" src="http://website:8888/wp-content/uploads/2015/12/cupcakes-and-cosmetics-logo.png" class="attachment-1 size-1" alt="cupcakes-and-cosmetics-logo" />

我希望它能像这样显示

 <img src="http://website:8888/wp-content/uploads/2015/12/cupcakes-and-cosmetics-logo.png" class="attachment-1 size-1" alt="cupcakes-and-cosmetics-logo" />

正在从一个可重复文件字段中提取图像，该字段的id为slide\\u image\\u id。我一直在四处查看，并注意到要使用wp\\u get\\u attachment\\u image\\u url，但当我将其与上述代码一起使用时，图像不会显示。我做错什么了吗？

 <?php echo $image = wp_get_attachment_image_url( $entry[\'slide_image_id\'], true, \'full\'); ?>

旁注：$条目[\'slide\\u image\\u id\']用于调用我的可重复文件字段。

4 个回复

最合适的回答,由SO网友:bosco 整理而成

你对两者的论点wp_get_attachment_image_url() 和wp_get_attachment_image() 顺序错误-请查看链接文档以了解详细信息。此外，wp_get_attachment_image_url() 返回URL-不是实际的图像元素。

删除width 和height 属性来自<img> 元素是不可取的：如果页面的布局在任何方面受到图像大小的影响，那么一旦指定图像尺寸的CSS或图像本身加载，布局就会“出现问题”。

不幸的是wp_get_attachment_image() 函数当前（自WordPress 4.4.1起）硬编码为输出width 和height <img> 属性（请参见ticket #14110), 因此，您需要自己构建图像标记。这可以通过从wp_get_attachment_image()\'s source:

<?php
  $attachment = get_post( $entry[\'slide_image_id\'] );

  if( $attachment ) {
    $img_size_class = \'full\';
    $img_atts = array(
      \'src\'   => wp_get_attachment_image_url( $entry[\'slide_image_id\'], $img_size_class, false ),
      \'class\' => \'attachment-\' . $img_size_class . \' size-\' . $img_size_class,
      \'alt\'   => trim(strip_tags( get_post_meta( $entry[\'slide_image_id\'], \'_wp_attachment_image_alt\', true) ) )
    );

    //If an \'alt\' attribute was not specified, try to create one from attachment post data
    if( empty( $img_atts[ \'alt\' ] ) )
      $img_atts[ \'alt\' ] = trim(strip_tags( $attachment->post_excerpt ));
    if( empty( $img_atts[ \'alt\' ] ) )
      $img_atts[ \'alt\' ] = trim(strip_tags( $attachment->post_title ));

    $img_atts = apply_filters( \'wp_get_attachment_image_attributes\', $img_atts, $attachment, $img_size_class );

    echo( \'<img \' );
    foreach( $img_atts as $name => $value ) {
      echo( $name . \'="\' . $value . \'" \';
    }
    echo( \'/>\' );
  }
?>

SO网友:birgire

解决方法

我做了一些岩心挖掘/测试，并通过wp_constrain_dimensions 过滤器：

// Add filter to empty the height/width array
add_filter( \'wp_constrain_dimensions\', \'__return_empty_array\' );
// Display image html
echo wp_get_attachment_image( $entry[\'slide_image_id\'], \'full\', true );
// Remove filter again
remove_filter( \'wp_constrain_dimensions\', \'__return_empty_array\' );

这似乎允许我们从生成的html图像中删除高度和宽度属性wp_get_attachment_image(), 不需要退出reg ex canons。我们也可以使用wp_get_attachment_image_src 以类似的方式过滤以删除宽度，但保留url。

注意：此解决方法将删除srcset 和sizes 属性。但是也可以通过第四个属性设置srcset和size属性$attr 输入参数。

正如@bosco所提到的，您已经在以下位置切换了图标和大小输入参数：

echo wp_get_attachment_image( $entry[\'slide_image_id\'], true, \'full\' );

请改用此选项：

echo wp_get_attachment_image( $entry[\'slide_image_id\'], \'full\', true );

SO网友:JMRC

我只是用CSS来做这个。它并不是在所有场景中都能工作，但通常情况下它会工作。让我们拍摄一张300px 300px的图像：

max-height: 300px;
max-width: 300px;
width: auto;

这将限制图像的尺寸，而不会丢失其宽高比。否则，也可以使用REGEX：

$html = preg_replace(array(\'/width="[^"]*"/\', \'/height="[^"]*"/\'), \'\', $html);

这些是一些替代方案。祝你好运

SO网友:Jahmic

Regex approach

检索将包含宽度和高度属性的原始图像输出后，只需用regex替换空字符串即可将其删除：

<?php
$raw_image = wp_get_attachment_image( $entry[\'slide_image_id\'], true, \'full\');
$final_image = preg_replace(\'/(height|width)="\\d*"\\s/\', "", $raw_image);
echo $final_image;
?>

将来，如果WordPress提供一个过滤器来获取和抑制这些属性，那就太好了。

小码农CODE

从wp_GET_ATTACH_IMAGE中删除维度

解决方法

相关推荐

Column Images Showing Gaps