[Resolved] Caption for the Gallery Images on Niche theme

[Marcel]

Hello,
I would like to have the image captions under every image in the single product page. I set up the right title, caption and alternative text on the Media library, but on the front end, on the single product page, when hovering over the image I can see just the title. I would like to have the caption under the image. May I have your support?
Thank you!
Marcel

[David]

Hi there,

in Appearance > Elements – edit the Hook: Gallery Stack.
Replace the code with this:

<div class="woo-sumamry-wrap"><!-- open wrap -->
    <div class="woo-gallery-stack hide-on-mobile">
        <?php 
        global $product;
        // Get post product thumbnail
        if ( has_post_thumbnail( $product->get_id() ) ) {
            $attachment_ids[0] = get_post_thumbnail_id( $product->get_id() );
            $attachment = wp_get_attachment_image_src( $attachment_ids[0], 'full' ); 
            $attachment_alt = get_post_meta( $attachment_ids[0], '_wp_attachment_image_alt', TRUE);
            $attachmnent_title = get_the_title( $attachment_ids[0] );
            $attachmnent_caption = wp_get_attachment_caption( $attachment_ids[0] );
            ?>    
            <img src="<?php echo $attachment[0] ; ?>" alt="<?php echo $attachment_alt; ?>" title="<?php echo $attachmnent_title; ?>" />
            <?php 
            if ( $attachmnent_caption ) {
                echo '<div class="woo-gallery-caption">' . $attachmnent_caption . '</div>';
            }
        }
        // Get Product Gallery Images
        if ( method_exists( $product, 'get_gallery_image_ids' ) ) {
            $product_image_ids = $product->get_gallery_image_ids();
            foreach( $product_image_ids as $product_image_id ) {
                $image_url = wp_get_attachment_url( $product_image_id, 'full' );
                $image_alt = get_post_meta( $product_image_id, '_wp_attachment_image_alt', TRUE);
                $image_title = get_the_title( $product_image_id );
                $image_caption = wp_get_attachment_caption( $product_image_id );
                echo '<img src="' . $image_url . '" alt="' . $image_alt . '" title="' . $image_title . '">';
                if ( $image_caption ) {
                    echo '<div class="woo-gallery-caption">' . $image_caption . '</div>';
                }
            }
        }
        // Closing div found in Close Summary Wrap element?>
	</div>

[Marcel]

David, thanks a lot.

[David]

You’re welcome

[Author]

Posts