Colorbox shows "This image failed to load" when going fullscreen with the gallery component

Created on 1 October 2024, about 1 month ago

Problem/Motivation

Trying to show a gallery image in fullscreen leads to Colorbox showing a "This image failed to load." message instead. This only seems to happen if the site is configured to use the `drimage` module-provided image styles in the view mode configuration for the Image Media type, which is then used by the Photo Gallery Block type display configuration (for both Grid and/or Masonry view modes).

Steps to reproduce

Proposed resolution

Create simple responsive image styles (rather than using drimage ones) to be used by the Image Media type view modes that you then configure the Photo Gallery Block view modes to use.

Issue is potentially related to https://www.drupal.org/project/rocketship_core/issues/3310353

🐛 Bug report
Status

Active

Version

6.2

Component

Code

Created by

🇵🇹Portugal joum Porto

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @joum
  • 🇵🇹Portugal joum Porto

    After attempting to solve the issue with the suggested approach, it worked, but now the Colorbox module isn't adding the previous/next gallery navigation controls.

    So basically, the steps in my resolution approach were:
    - I created simple responsive image styles to mimic the DRImage ones being used.
    - I created new Image Media view modes to be used in place of the current "1:1 Aspect Ratio" and "Original Aspect Ratio" ones, which in turn use the new responsive image styles created before
    - I configured the Photo Gallery Block type "Grid" and "Masonry" view modes to use the new Image Media view modes accordingly and set the "Colorbox grouping" settings to match what was in place before (showed navigation, but didn't load image in fullscreen).

    I have also tried changing the Colorbox Responsive field formatter gallery grouping settings, but none of the options worked as intended neither.

    I wonder if there is any custom JS initialising Colorbox and overriding the grouping setting?

  • 🇵🇹Portugal joum Porto

    Ended up reverting colorbox to 2.0.2 instead of using 2.1.1 and this was solved. CLosing as it is Colorbox-related and doesn't belong in this queue.

Production build 0.71.5 2024