-2

Is it possible to make the colorbox popup take more complex content than just an image and a caption?

On a drupal 9 site I have been asked to modify a simple colorbox gallery to include a long/formatted Caption/story and a title in a responsive two-panel pop-up.

Is such a thing even possible or am I better of building something like this from scratch or with something else?

to expand on the format:

  1. View showing a custom media type with several fields
  2. Each popup should contain 3 fields - A Title, A Story and an Image
  3. Should be a responsive two-column (Image + Story) at desktop to Image on top of story on mobile

What I really want is colorbox to act as a formatter for an entire entity and then be able to template the content it injects into the pop-up

2
  • What colorbox? Everything is possible.
    – leymannx
    Feb 27, 2023 at 10:32
  • Any more details? From my reading of the documentation and module issue list, it appears this may not be possible with Drupal 9 Colorbox.
    – tanbog
    Feb 27, 2023 at 12:05

1 Answer 1

1

After a few days of pain I think I have a solution. In case it is of use to anyone else.

Firstly: Colorbox 2.0 (Drupal 9/10 version) cannot load entities. By default, it is only an image formatter. From the project site:

Colorbox for Drupal 8 is an image field formatter and nothing more, or less.

Solution 1: HTML Formatted Media type Caption

It is possible to have colorbox load a Media entity image field and pass another custom field as the caption. With some tweaking, you can get html working as well. This can be setup on the entity display settings or in a view (as a formatter for the image field). It is not very flexible. The caption will, by default, also be the image title which can cause issues if you are loading html. You will probably also need to fiddle with the allowed html tags in the colorbox module's settings.

If that is what you need, that is doable. If you need anything more complex read on.

Solution 2: Adding full entities

There is a mobule that extends colorbox to allow the loading of entities it is called Colorbox Entity Display

It doesn't completely integrate with colorbox. In order to have the entity load you need to add a class to a link.

It DOES NOT work for media entities; at least I couldn't get it to work. You will need to make a normal content type and configure it to look how you want it to appear in the modal.

Colorbox will attempt to load the node portion of the content so you can just override the node template with whatever format you want.

The process for getting entities into a view based photo gallery is:

  1. Create view with at least - Image field, Link to content (as text and hidden), field for link title (hidden)
  2. Re-write the output of the image field as a link and pass the two other fields as well as the custom colorbox-entity class to the link.

After that, you should have a colorbox gallery with the ability to load entities into the modal.

Not the answer you're looking for? Browse other questions tagged or ask your own question.