从wp_get_attachment_image删除尺寸

10

使用wp_get_attachment_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_image_id的条目的可重复文件字段中提取的。我一直在四处张望，并注意到要使用wp_get_attachment_image_url，但是当我在上面的代码中使用它时，图像不会显示。我做错什么了吗？

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

旁注：$ entry ['slide_image_id']是用来调用我的可重复文件字段的内容。

custom-field attachments images

— 用户名
source

wp_get_attachment_image_url()返回URL-不是图像元素。

— 博斯科

什么是我在寻找@bosco的最佳解决方案

— user3756781 2016年

哇，add_filter('wp_get_attachment_image_attributes' ...除了只对height和width进行硬编码之外，img输出的每个属性都可以过滤是多么令人讨厌。

— squarecandy18年

9

您的两个参数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>属性（请参见故障单＃14110），因此您需要自己构建图像标记。这可以通过从wp_get_attachment_image()的来源获取提示来完成：

<?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( '/>' );
  }
?>

— 博斯科
source

我确实遵循了您发送给我的链接，并且能够毫无问题地生成图像以及使用您的解决方案。我唯一遇到的问题是alt标签。使用您发送给我的链接，不会生成alt标签，而使用您的链接则是静态的（这就是为什么我认为wp_get_attachment_image是最好的选择）。如何使用您显示的示例生成alt标签？@bosco

— user3756781 2016年

事实证明，这个问题比我预期的要复杂。更新了我的答案，以包括中的<img>属性生成位wp_get_attachment_image()-尽管我省略了用于响应图像的srcset和sizes部分。如果需要这些，get_sizeless_attachment_image()建议创建一个函数。

— 博斯科，2016年

谢谢你，这很完美。代码内部有一个错误，原因是缺少字符echo（$ name。'=“'。$ value。'”';应该是echo（$ name。'=“'。$ value。'”'）;。再次感谢您的帮助@bosco

— user3756781 2016年

12

解决方法

我进行了一些核心挖掘/测试，并通过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中删除height和width属性wp_get_attachment_image()，而无需退出reg-ex规范。我们也可以使用wp_get_attachment_image_src过滤器以类似的方式删除宽度 / 高度，但保留网址。

笔记

此解决方法也将删除srcset和sizes属性。但它也可以设置srcset和大小通过第四属性$attr输入参数。

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

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

使用此代替：

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

— 比尔吉雷
source

1

我只是为此使用CSS。并非在所有情况下都有效，但经常会起作用。让我们以300px x 300px的图片为例：

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

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

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

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

— JMRC
source