Adjusting caption below single post image

Question

First of all, I have to apologize, my php-skills aren't good enough to solve this myself. So I hope that someone will kindly help me in this matter.

I'm trying to adjust the image caption below single post images. Instead of displaying the caption (post_excerpt), I would like to display the image title (post_title) and image description (post_content). I somewhat got what I'm looking for with the following code:

add_shortcode('wp_caption', 'img_caption_add_description');
add_shortcode('caption', 'img_caption_add_description');
function img_caption_add_description($attr, $content = null)
{
$post_id = str_replace('attachment_', '', $attr['id']);
$img = get_post((int)$post_id);

if (is_a($img, 'WP_Post')) {
    $image_title = $img->post_title;
    $image_content = $img->post_content;
    $attr['caption'] = '<span class="title-css">' . $image_title . '</span><br><span class="description-css">' . $image_content . '</span>';
}

return img_caption_shortcode($attr, $content);
}

Obviously, title and description are only added to the caption as shown here:

How can I replace the caption with the image title and description, thus only showing title and description?

My caption shortcode in the editor looks like this:

[caption id="attachment_214" align="alignleft" width="999"]
<img class="size-full wp-image-214"
    src="https://www.[...]/wp-content/uploads/2017/02/geierlay-2.jpg"
    alt="Alt Geierlay" width="999" height="749" />
 Bechriftung Test[/caption]

Answer 1

Override The Image Caption With Image Title And Description

Here's a way to override the caption with the image title and image description, with a demo plugin.

Let's assume we have uploaded this image:

Then we insert it into the editor with the following:

[caption id="attachment_123" align="aligncenter" width="300"]
  <a href="https://example.tld/2017/03/01/hello-world/espresso/"    
       rel="attachment wp-att-123">
    <img src="https://example.tld/wp-content/uploads/2017/03/espresso-300x180.jpg" 
         alt="" width="300" height="180" class="size-medium wp-image-123" />        
   </a> espresso caption
[/caption]

Before:

Without our plugin activated it will display as:

After:

With the plugin activated it displays:

Hope it helps!

Demo plugin:

We use the filters img_caption_shortcode and shortcode_atts_caption.

Here we wrap it into a class to pass on the attachment id between the filter callbacks.

<?php
/**
 * Plugin Name: Modified Image Caption
 * Description: Override The Image Caption With Image Title And Description
 * Plugin URI:  http://wordpress.stackexchange.com/a/258612/26350
 */

namespace WPSE\Q258586;

add_action( 'init', [ new Caption, 'init' ] );

class Caption
{
    private $attachment_id ;

    public function init()
    {
        add_filter( 'img_caption_shortcode',    [ $this, 'shortcode' ], 999, 3 );
        add_filter( 'shortcode_atts_caption',   [ $this, 'atts' ],      999, 3 );
    }
    public function shortcode( $output, $attr, $content )
    {
        if( isset( $attr['id'] ) && preg_match( '/attachment_\d+/i', $attr['id' ] ) )
            $this->attachment_id = str_replace( 'attachment_', '', $attr['id'] );

        return $output;
    }

    public function atts( $atts, $pair )
    {
        if( ! $this->attachment_id  )
            return $atts;

        $img = get_post( $this->attachment_id );

        if( is_a( $img, '\WP_Post' ) )
        {
            $atts['caption'] = sprintf( 
                '<span class="title-css">%s</span>
                 <br><span class="description-css">%s</span>',
                esc_html( $img->post_title ),
                esc_html( $img->post_content )
            );
        }

        $this->id = null;

        return $atts;
    }
}