WordPress img alt text

I’m looking to print out the alt text for each thumbnail image on this page http://www.venaproducts.com/dev/product/fosmon-hybo-duoc-case-for-amazon-fire-phone/

However the first image alt text seems to be used for ALL thumbnail images even though the alt text are different. Any help is much appreciated.

Read More
global $post, $product, $woocommerce;

$attachment_ids = $product->get_gallery_attachment_ids();

if ( $attachment_ids ) {
?>
<div id="product-images" class="thumbnails"><?php
    $small_img   = wp_get_attachment_image_src(get_post_thumbnail_id(),'single-product-thumbnail');
    $middle_img  = wp_get_attachment_image_src(get_post_thumbnail_id(),'single-product');
    $large_img   = wp_get_attachment_image_src(get_post_thumbnail_id(),'single-product-zoom');
    $img_id = get_post_thumbnail_id(get_the_id());
    $alt_text = get_post_meta($img_id, '_wp_attachment_image_alt', true);


    echo '<a href="#" data-image="' . $middle_img[0] . '" data-zoom-image="' . $large_img[0] . '">
              <img src="' . $small_img[0] . '" alt="' . $alt_text . '">
          </a>';
    $loop = 0;
    $columns = apply_filters( 'woocommerce_product_thumbnails_columns', 3 );

    foreach ( $attachment_ids as $attachment_id ) {

        $classes = array( 'zoom' );

        if ( $loop == 0 || $loop % $columns == 0 )
            $classes[] = 'first';

        if ( ( $loop + 1 ) % $columns == 0 )
            $classes[] = 'last';

        $image_link = wp_get_attachment_url( $attachment_id );

        if ( ! $image_link )
            continue;

        // $image       = wp_get_attachment_image( $attachment_id, apply_filters( 'single_product_small_thumbnail_size', 'shop_thumbnail' ) );
        // $image_class = esc_attr( implode( ' ', $classes ) );
        // $image_title = esc_attr( get_the_title( $attachment_id ) );
        $small_img = wp_get_attachment_image_src( $attachment_id, 'single-product-thumbnail' );
        $middle_img = wp_get_attachment_image_src( $attachment_id, 'single-product' );
        $large_img = wp_get_attachment_image_src( $attachment_id, 'single-product-zoom' );

        // echo apply_filters( 'woocommerce_single_product_image_thumbnail_html', sprintf( '<a href="%s" class="%s" title="%s"  rel="prettyPhoto[product-gallery]">%s</a>', $image_link, $image_class, $image_title, $image ), $attachment_id, $post->ID, $image_class );
        echo '<a href="#" data-image="' . $middle_img[0] . '" data-zoom-image="' . $large_img[0] . '">
                  <img src="' . $small_img[0] . '" alt="' . $alt_text . '">
              </a>';

        $loop++;
    }

?></div>
<div class="carousel-prev product-prev"></div>
<div class="carousel-next product-next"></div>
<?php

}

Related posts

Leave a Reply

1 comment

  1. You set your $alt_text value when you handle the post thumbnail, outside the foreach loop.

    In your foreach loop, when you are going through the attachments, you have forgotten to update the value.

    Try something like this in the foreach loop:

    $small_img = wp_get_attachment_image_src( $attachment_id, 'single-product-thumbnail' );
    $middle_img = wp_get_attachment_image_src( $attachment_id, 'single-product' );
    $large_img = wp_get_attachment_image_src( $attachment_id, 'single-product-zoom' );
    $alt_text = get_post_meta($attachment_id, '_wp_attachment_image_alt', true);