Remova a dimensão de wp_get_attachment_image

10

Estou tendo algum problema ao remover a largura e a altura das imagens do meu anexo ao usar wp_get_attachment_image. É isso que estou usando para exibir a imagem

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

Como fica o código fonte

 <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" />

Eu gostaria que fosse exibido assim

 <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" />

A imagem está sendo extraída de um campo de arquivo repetitivo com uma entrada com um ID de slide_image_id. Estou procurando e tenho o aviso de usar wp_get_attachment_image_url, mas quando o uso com o código acima, a imagem não é exibida. Existe algo que estou fazendo de errado?

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

Nota lateral: $ entry ['slide_image_id'] é o que está sendo usado para chamar meu campo de arquivo repetitivo.

user3756781
fonte
wp_get_attachment_image_url()retorna um URL - não um elemento de imagem.
bosco
Qual será a melhor solução no que eu estou procurando @bosco
user3756781
Uau, como é irritante que todos os atributos da saída img sejam filtráveis, add_filter('wp_get_attachment_image_attributes' ...exceto apenas altura e largura, são codificados.
Squarecandy

Respostas:

9

Seus argumentos para ambos wp_get_attachment_image_url()e wp_get_attachment_image()estão na ordem errada - verifique a documentação vinculada para obter detalhes. Além disso, wp_get_attachment_image_url()retorna um URL - não um elemento de imagem real.

A remoção dos atributos widthe heightdos <img>elementos é desaconselhável: se o layout da página for de alguma forma influenciado pelo tamanho da imagem, o layout "falha" assim que o CSS que especifica as dimensões da imagem ou a própria imagem carregar.

Infelizmente, a wp_get_attachment_image()função está atualmente (como no WordPress 4.4.1) codificada para gerar os atributos widthe height <img>(consulte o ticket 14110 ), portanto, você precisará criar a marcação da imagem por conta própria. Isso pode ser feito seguindo sugestões da wp_get_attachment_image()fonte de :

<?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( '/>' );
  }
?>
bosco
fonte
Eu segui o link que você me enviou e foi capaz de gerar a imagem sem problemas, além de usar sua solução. O único problema que estou tendo como é com a tag alt. Com o link que você me enviou, uma tag alt não é gerada e com a sua é estática (e foi por isso que pensei que wp_get_attachment_image seria a melhor opção). Como eu geraria uma tag alt com o exemplo que você está exibindo? @bosco
user3756781
A questão acabou sendo mais complicada do que eu imaginava. Atualizei a minha resposta para incluir os <img>bits de geração atributo wp_get_attachment_image()- embora eu deixei de fora os srcsete sizespeças utilizadas para imagens responsivos. Se isso for necessário, get_sizeless_attachment_image()é recomendável criar uma função .
bosco
obrigado isso funcionou perfeito. Ocorreu um erro no código para um erro de caractere echo ($ name. '= "'. $ Value. '"'; Deve ser echo ($ name. '= "' $ Value. '"') ;. Obrigado novamente por sua ajuda @bosco
user3756781
12

Gambiarra

Fiz algumas escavações / testes principais e encontrei uma solução alternativa através do wp_constrain_dimensionsfiltro:

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

Isso parece nos permitir remover os atributos de altura e largura do html de imagem gerado wp_get_attachment_image(), sem sair dos cânones reg-ex. Também poderíamos usar o wp_get_attachment_image_srcfiltro de maneira semelhante para remover a largura / altura, mas manter o URL .

Notas

Esta solução irá remover o srcsete sizesatributos também. Mas também é possível definir as srcset e tamanhos atributos através da quarta $attrargumento de entrada.

Conforme mencionado por @bosco, você alterou os argumentos de entrada de ícone e tamanho em:

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

Use isto:

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

Eu simplesmente usei CSS para este. Não funciona em todos os cenários, mas com freqüência suficiente. Vamos dar uma imagem de 300 px x 300 px:

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

Isso restringe as dimensões da imagem sem perder sua proporção largura / altura. Caso contrário, você também pode usar o REGEX:

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

Estas foram algumas alternativas. Boa sorte.

JMRC
fonte