添付画像srcの取得とクラスの追加


8

それぞれに4つの添付画像が含まれている投稿があります。私が私のsingle.phpでやろうとしていることは、4つの画像すべてを取得して、各画像に異なるクラスを追加できるようにすることです。

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

これが私が試したことですが、srcを取得する代わりに配列を取得します...私は本当に解決策に近いと思いますが、私が間違っていることを見つけることができません...

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

誰かがこれを手伝ってくれる?

ありがとう

回答:


13

余分なクラスを追加するだけの場合は、を使用する必要がありますwp_get_attachment_image。追加のパラメーターはほとんどなく、最後のパラメーターはクラス名の設定に使用されます。

使用例:

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

このアプローチの主な利点は、srcset属性全体を無料で取得できることです。


0

wp_get_attachment_image_src3つの要素を持つ配列を返します。画像のURL、幅、高さ。結果の最初のインデックスをエコーする必要があります。

実際、foreachループを使用することで、コードを少しスリムにすることができます。

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] . '" />';
}

使用できるURLだけが必要な場合wp_get_attachment_image_url()
iantsch
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.