Gallery image caption inside link <a>

Question

I use WordPress native gallery – and it's output for each image is that:

<dl class="gallery-item">
  <dt class="gallery-icon">
    <a href="(...)"><img src="(...)"></a>
  </dt>
  <dd class="wp-caption-text gallery-caption">
    Caption here
  </dd>
</dl>

The source that does that is:

foreach ( $attachments as $id => $attachment ) {
        $link = isset($attr['link']) && 'file' == $attr['link'] ? wp_get_attachment_link($id, $size, false, false) : wp_get_attachment_link($id, $size, true, false);

        $output .= "<{$itemtag} class='gallery-item'>";
        $output .= "
            <{$icontag} class='gallery-icon'>
                $link
            </{$icontag}>";

        if ( $captiontag && trim($attachment->post_excerpt) ) {
            $output .= "
                <{$captiontag} class='wp-caption-text gallery-caption'>
                " . wptexturize($attachment->post_excerpt) . "
                </{$captiontag}>";
        }
        $output .= "</{$itemtag}>";
        if ( $columns > 0 && ++$i % $columns == 0 )
            $output .= '<br style="clear: both" />';
    }

I want that the output be:

<dl class="gallery-item">
  <dt class="gallery-icon">
    <a href="(...)">
        <img src="(...)">
        Caption here
    </a>
  </dt>
</dl>

But I can't get the link -or- the image, since the link is printed with the image from "$link". How can I do that?

Answer 1

You should get the attachment differently.

Use wp_get_attachment_url for the file url https://codex.wordpress.org/Function_Reference/wp_get_attachment_url

In your case it's an image so I would suggest wp_get_attachment_image_src so you can define an image size. https://developer.wordpress.org/reference/functions/wp_get_attachment_image_src/

This way you can greate your own "template" to echo the image link.

To get the image metadata you can simply use get_post( $id ) since an image is a post type aswell (attachment).

(Edit) An example:

foreach ( $attachments as $id => $attachment ) {
    $large_image = wp_get_attachment_image_src( $id, 'full' );
    $small_image = wp_get_attachment_image_src( $id, 'medium' ); // Cange the size to anything

    $output .= "<{$itemtag} class='gallery-item'>";
    $output .= "<{$icontag} class='gallery-icon'>";
    $output .= "<a href='{$large_image[0]}'>";
    $output .= "<img src='{$small_image[0]}' alt='{$attachment->post_title}' />";
    if ( $captiontag && trim($attachment->post_excerpt) ) {
        $output .= "
            <{$captiontag} class='wp-caption-text gallery-caption'>
            " . wptexturize($attachment->post_excerpt) . "
            </{$captiontag}>";
    }
    $output .= "</a>";
    $output .= "</{$icontag}>";
    $output .= "</{$itemtag}>";

    if ( $columns > 0 && ++$i % $columns == 0 )
        $output .= '<br style="clear: both" />';
}