WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.
https://wordpress.org/gutenberg/
Other
10.34k stars 4.13k forks source link

[Post Featured Image]: add option to display image caption/credit #40946

Open samiff opened 2 years ago

samiff commented 2 years ago

What problem does this address?

When using a block theme that leverages wp:post-featured-image to display a post's featured image, there is no caption being rendered by that block, nor is there an option to do so.

Jetpack for example offers external media providers like Openverse and Pexels that users can select from when setting a featured image. Generally, the Caption field is used to credit the source, and you'll see that themes like Twenty Twenty will render the caption/credit for featured images by default.

Concern originally raised in: https://github.com/Automattic/jetpack/issues/23408

What is your proposed solution?

Given the fluid discussion in: https://github.com/WordPress/gutenberg/issues/27617

I'm not quite sure at this point, but I think it'd be nice to have an option that would show the caption/credit for the featured image - especially when the images are sourced from a third-party. At bare minimum, at least have the figcaption output in the HTML even if it's not visually displayed.

kaffeeringe commented 1 year ago

I can't use Gutenberg themes, until it displays the description caption. I stored all the copyright notices there.

hagege commented 1 year ago

That would indeed be a nice option, e.g. by ticking in the properties whether that should be shown.

carolinan commented 1 year ago

@kaffeeringe even in classic PHP based themes, displaying the description is a custom solution. Chances are that this field will never be supported by the block by default. You may want to consider moving the data to another field in your database, like the caption.

carolinan commented 1 year ago

I learnt that none of the media captions use the caption text from the media library. So if we want the caption to use the media library data by default, they all need to be updated, not only the post featured image block.

I want to read up on the history and why this choice was made. It is probably because the same media can be used in multiple places and one caption may not be enough because it is situational. But it has that side effect that existing data is not easily available.

kaffeeringe commented 1 year ago

@carolinan Sorry, I mixed up the fields. I use Wordpress in German and there caption and description are called "Beschriftung" and "Beschreibung" and I always mix them up. I use the caption field with my images.

It would be nice if the caption was only the suggested caption if you use an image in a block or as featured image. So you can reuse an image with different captions.

carolinan commented 1 year ago

It could be used as a pre-filled placeholder, interesting idea.

greening commented 1 year ago

I'm refactoring a couple of websites into FSE, and I really wish this was available in the Featured Image block. (I don't need it for copyright declarations, but sure would like it for traditional captions.

jethin commented 1 year ago

Greetings,

I agree that the ability to show captions on featured images should be rolled into WP. Until then, I came up with the following workaround:

Set up a block variation. "For now, let’s create variations.js and put the file in our theme’s assets/js folder":

wp.blocks.registerBlockVariation(
    'core/post-featured-image',
    {
        name: 'sotp_post_featured_image',
        title: 'Post Featured Image + Caption',
        description: 'Displays the post\'s featured image with caption.',
        isActive: [ 'namespace' ],
        attributes: {
            namespace: 'sotp_post_featured_image',
            className: 'sotp-post-featured-image'
        },
        scope: [ 'inserter' ]
    }
);

"Next, you need to enqueue variations.js... This code should generally be placed in your theme’s functions.php..."

function example_enqueue_block_variations() {
    wp_enqueue_script(
        'example-enqueue-block-variations',
        get_template_directory_uri() . '/assets/js/variations.js',
        array( 'wp-blocks', 'wp-dom-ready' ),
        wp_get_theme()->get( 'Version' ),
        false
    );
}
add_action( 'enqueue_block_editor_assets', 'example_enqueue_block_variations' );

And finally filter the block render (functions.php):

function include_feature_image_caption($block_content, $block){
    if ( isset($block['attrs']['className']) && $block['attrs']['className'] === 'sotp-post-featured-image') {
        $caption = '<figcaption class="wp-element-caption">' . get_the_post_thumbnail_caption() . '</figcaption>';
        $block_content = str_replace('</figure>', $caption . '</figure>', $block_content);
    }
    return $block_content;
}
add_filter( 'render_block_core/post-featured-image', 'include_feature_image_caption', 10, 2 );

I make no guarantees for this code. Hope it helps someone.

[updated enqueuing as per @janvitos comment below.]

janvitos commented 1 year ago

Hope it helps someone

Works like a charm, thanks @jethin!

Just one thing: How do you register your block variation? Using PHP?

I did it this way, but I'm not sure it's the "proper way":

add_action( 'enqueue_block_editor_assets', function() {
    wp_enqueue_script( 'prefix-block-variations', THEME_JS_URL . 'block-variations.js', array( 'wp-blocks' ) );
});
kevinpoot commented 12 months ago

IMO this should definitely be included inside the block with an option to disable (or enable) it. Any update on this being implemented anytime soon?

belisama commented 11 months ago

Screenshots: https://wordpress.org/support/topic/caption-for-post-featured-image/

supernovia commented 10 months ago

Wondering about this since another user asked about it today. I'd love to see the ability to put credits / captions on featured images, especially with Openverse. :)

nickbohle commented 8 months ago

Hi all,

I just had the issue myself that I wanted to display the caption below a featured post image. (Using TT4, caption is saved with the image in the media library). Unfortunately, this was not possible.

As mentioned above, I would love the caption option to be added to the "Post Featured image" block like in the "Image" block. But different to the "image" block, I would prefer that the display of the caption is opt-in and not opt-out. This way, users are not confused, when suddenly captions appear under their featured post images.

iamtakashi commented 5 months ago

+1 !!

nickbohle commented 5 months ago

Actually, it could be the easiest way to promote the OpenVerse, if the caption plus the licence would include a direct link to the openverse. Right, Matt?

dhanson-wp commented 5 months ago

+1 !!!!! to the featured image caption, and an alt text field in the block settings.

noellesteegs commented 5 months ago

Thank you @jethin for the workaround. I think this feature would make a great addition.

jordonrupp-dev commented 1 month ago

+1