obtendo imagens de anexo src e adicionar classes

8

Tenho posts cujo cada um contém 4 imagens anexadas. o que estou tentando fazer no meu single.php é fazer com que todas as 4 imagens src sejam capazes de adicionar classes diferentes a cada imagem.

<img class="image_1 no_lazy" src="first attached image src"/>
<img class="image_2" src="second attached image src"/>
<img class="image_3" src="third attached image src"/>
<img class="image_4" src="fourth attached image src"/>

Aqui está o que eu tentei, mas recebo uma matriz em vez de obter o src ... Acho que estou muito perto da solução, mas não consigo descobrir o que estou fazendo de errado ...

<?php
  global $post;
  $args = array( 
    'post_parent' => $post->ID, 
    'post_type' => 'attachment', 
    'post_mime_type' => 'image', 
    'orderby' => 'menu_order', 
    'order' => 'ASC', 
    'numberposts' => 4 );
   $images = get_posts($args); ?>

<img class="image_1 no_lazy" src="<?php  echo wp_get_attachment_image_src( $images[0]->ID, 'full' ); ?>"/>
<img class="image_2" src="<?php  echo wp_get_attachment_image_src( $images[1]->ID, 'full' ); ?>"/>
<img class="image_3" src="<?php  echo wp_get_attachment_image_src( $images[2]->ID, 'full' ); ?>"/>
<img class="image_4" src="<?php  echo wp_get_attachment_image_src( $images[3]->ID, 'full' ); ?>"/>

alguém pode me ajudar com isso?

obrigado

user2882154
fonte

Respostas:

13

Se você deseja adicionar apenas uma classe extra, use-o wp_get_attachment_image. Possui poucos parâmetros extras e o último é usado para definir nomes de classes.

Uso da amostra:

<?php echo wp_get_attachment_image( get_the_ID(), 'thumbnail', "", ["class" => "my-custom-class"] ); ?>

A principal vantagem dessa abordagem é que você também receberá todos os srcsetatributos de graça.

Ionut Staicu
fonte
0

wp_get_attachment_image_srcretorna uma matriz com 3 elementos; o URL da imagem, a largura e a altura. Você precisa repetir o primeiro índice do resultado.

De fato, você pode tornar seu código um pouco mais enxuto usando um foreachloop:

foreach ( $images as $i => $image ) {
    $src = wp_get_attachment_image_src( $image->ID, 'full' );

    echo '<img class="image_' . ++$i;
    if ( $i === 1 )
        echo ' no_lazy';
    echo '" src="' . $src[0] . '" />';
}
TheDeadMedic
fonte
se você só precisa do URL que você pode usarwp_get_attachment_image_url()
iantsch