mendapatkan gambar lampiran src dan menambahkan kelas

8

Saya memiliki posting yang masing-masing berisi 4 gambar terlampir. apa yang saya coba lakukan di single.php saya adalah untuk mendapatkan semua gambar 4 src untuk dapat menambahkan kelas yang berbeda untuk setiap gambar.

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

di sini adalah apa yang saya coba, tetapi saya mendapatkan sebuah array daripada mendapatkan src ... Saya pikir saya benar-benar dekat dengan solusinya, tetapi saya tidak dapat menemukan apa yang saya lakukan salah ...

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

adakah yang bisa membantu saya dengan ini?

Terima kasih

pengguna2882154
sumber

Jawaban:

13

Jika Anda hanya ingin menambahkan kelas tambahan, maka Anda harus menggunakannya wp_get_attachment_image. Ini memiliki beberapa params tambahan, dan yang terakhir digunakan untuk menetapkan nama kelas.

Penggunaan sampel:

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

Keuntungan utama dari pendekatan ini adalah Anda juga akan mendapatkan seluruh srcsetatribut secara gratis.

Ionut Staicu
sumber
0

wp_get_attachment_image_srcmengembalikan array dengan 3 elemen; URL gambar, lebar, dan tinggi. Anda perlu mengulangi indeks hasil pertama.

Bahkan, Anda dapat membuat kode Anda sedikit lebih ramping dengan menggunakan satu 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
sumber
jika Anda hanya perlu URL yang dapat Anda gunakanwp_get_attachment_image_url()
iantsch