Image description missing in carousel view

  • Unknown's avatar

    I’ve been using WP for many years and I think I know my way around, however since the “block editor” update, the image carousel view has changed – for the worse.

    In the past a tiled gallery would open any image in the carousel view, showing the caption, description, a comments field and an option to view the image in full size. Now the carousel view only shows the image caption and a small comment icon in the lower right corner.

    Example page

    If you click on any image in that post you see what I mean. The description text is only available by opening an image’s attachement page via right click-open in new page.

    Is there an option or a css code to bring back image descriptions?

    Thanks!

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Here’s a better example:

    Carousel view (without description)
    Attachement page view (with description)

  • Hi there,

    The change you refer to is not related to the block editor. It is due to a recent redesign of the Gallery Carousel feature itself, which we announced here:

    Make Your Best Photos Shine

    So this is intentional – the purpose behind the redesign was so the entire screen would be used for the image itself, instead of sharing screen space with a bunch of text content.

    The details you want are not simply hidden by CSS – they no longer form part of the carousel at all, so CSS cannot be used to bring them back. But I’ve opened a feature request to have the description visible when one clicks a button below the image.

  • Unknown's avatar

    Well…. that sucks! So there’s no way to make the description available to my visitors anymore. Who approves these kind of changes… smh

    Where can I track the feature request?
    How realistic is it that this will be implemented and when can I expect it approximately?
    I guess I’ll have to come up with some kind of workaround for now….

  • Hi there,

    You can follow the progress in our GitHub repo:

    https://github.com/Automattic/jetpack/issues/20291

  • I did a bit more testing on this, and the image description is there. It’s just hidden behind an info button:

    https://d.pr/i/yde7mQ

    But that button is only visible if you enable the media setting to show Exif data for images. If Exif data is hidden, as it is on your site, the info button is not shown, so there’s no way to find the description. Some other image data is also being hidden unintentionally as a result.

    The issue @fstat linked to above is to address the latter issue, but it’s likely that fixing one will also fix the other. For now, if you enable Exif data for the carousel, you’ll have the Info button which gives access to the image description again.

    You can change that setting here:

    https://anakin022.wordpress.com/wp-admin/options-media.php

  • Unknown's avatar

    Nice find, thank you for investigating further! I activated it and it looks OK now, so thank you!

    Allthough I find the design decision to hide the description behind a small, easy to miss button not ideal. I’d prefer to have the description text visible at all times or at least give an indication that there’s a description available behind the ( i ) button, just like you do it with the comments icon. As of now it’s more like form following function.

  • Unknown's avatar

    Thank you for posting this! I’ve been scratching my head trying to figure out why the instructions in my site’s knitting tutorial disappeared. I added them in the Description field of the Media Library and they were there one day and gone the next.

    While now I understand how I can get the instructions back, count me in with @anakin022 that hiding that info behind a small and easy to miss button is, for me, less than ideal in this situation. How can I get that info to display all the time? Right now visitors only see the photos without any explanation, which for a tutorial doesn’t do the job. Here’s an example.

    My site isn’t a photography site, so having to display the EXIF data on photos in the image carousel sitewide is rather pointless and distracting as heck.

  • Thanks for feedback on this, both of you :)

    I can’t make any promises whether or not the description will remain hidden behind a button, but our developers will consider your feedback when they make the decision on this.

  • Unknown's avatar

    I have discovered the same issue & read about the ‘exif fix’ here.

    Please consider the context of existing galleries of images, a carefully worded description is not optional ‘metadata’. Revealing a ‘text description’ underscored by camera exif data looks messy & unprofessional.

    Losing descriptions also disrupts the educational context of a sequence of images in a gallery slideshow, as an action is required to ‘reveal’ contextual information – the tiny [i] is placed so far down the page/window it is easily missed by a casual web visitor.

    There will be many WP users who are unaware that their image descriptions have disappeared, and in some themes the ‘description’ is still missing after enabling ‘exif’.

    I hope the ‘developers’ will take on board all the experiental feedback, and see how a ‘switch’ to a ‘fast swipe & zoom experience’ impacts deeper engagement & understanding of image content.

  • Hi folks,

    I’ve discovered I was mistaken – it is possible to reveal the image description using custom CSS code, without having to enable the image metadata option in settings.

    If you’re on the Premium Plan or higher, you can add this code in the CSS section of the Customizer:

    .jp-carousel-info-extra,
    .jp-carousel-image-meta {
        display: block;
    }
  • Unknown's avatar

    Thanks, but this isn’t happening for me.

    I unchecked “Show metadata in carousel” in Media Settings and saved my settings.

    I added the CSS you’ve given in the Customizer and saved changes.

    However, no descriptions appear on the photos in the Carousel. (Screenshot)

    Does this CSS perhaps need to be tweaked for my theme, which is Button2? Also, the post that contains that carousel was created with the older editor and now appears in a “classic” block if I go to edit it.

    Regardless, I think image descriptions and/or titles, which is basic information, should be available for everyone, not just those with an upgrade.

  • Unknown's avatar

    That CSS doesn’t work for my blog either.

    And I agree that there needs the be an option (for everyone) to show descriptions without the need to click a button or enabling exif data.

  • Okay, it looks like in some cases, the Carousel’s own CSS loads only after the site’s custom CSS, so the carousel’s CSS is overriding the custom CSS. You can force the custom CSS to always be used by changing it to this:

    .jp-carousel-info-extra,
    .jp-carousel-image-meta {
        display: block !important;
    }

    Normally, using !important isn’t a good idea, but in this case it’s the only way this CSS will work.

    Regardless, I think image descriptions and/or titles, which is basic information, should be available for everyone, not just those with an upgrade.

    I completely agree with this. This CSS code is just a temporary workaround for those that can, and want to use it on their sites until our team is able to fix the underlying issue.

  • @yarnaholic

    Also, the post that contains that carousel was created with the older editor and now appears in a “classic” block if I go to edit it.

    That’s expected, yes. Any content created in the old WordPress editor will appear in a classic block in the block editor – the classic block emulates how the old WordPress editor worked, and exists to ensure backwards compatibility with older content.

    You can either leave that content as a classic block, or you can use the Convert to Blocks option that appears at the top to update everything to the new blocks.

    If you have questions about this, or need help with using the block editor, it’s best if you start a new thread so we can help you there :)

  • Unknown's avatar

    OK-that version worked for me, thanks, but I don’t think it’s going to be obvious to people visiting that carousel that they need to scroll down to see the description. :(

    Just noting that my site doesn’t have any other Custom CSS, only what you provided here.

    As far as having created the post in the older editor, I just mentioned it in case it affected the solution.

    This CSS code is just a temporary workaround for those that can, and want to use it on their sites until our team is able to fix the underlying issue.

    That’s good to hear. Thanks!

  • Unknown's avatar

    It looks like this is resolved for my site. Thanks. Can’t say for the others who posted here.

    While the description now appears above the fold, I wasn’t expecting the font used there to be the same as my site’s header (Cherry Swash). The description also appears again below the fold by clicking on the “i” icon and there the font is larger and more “neutral.”

  • The topic ‘Image description missing in carousel view’ is closed to new replies.