Similar question to How to set width to Media entity image in CKEditor BUT I am trying to do more than insert various sizes of images, I want to add classes to the actual img tag. So when I insert an image that I've already added to my media into ckeditor, it shows up as drupal-entity instead of img. Specifically:

<drupal-entity alt="test" data-embed-button="media_browser" data-entity-embed-display="media_image" data-entity-embed-display-settings="{&quot;image_style&quot;:&quot;&quot;,&quot;image_link&quot;:&quot;&quot;}" data-entity-type="media" data-entity-uuid="9467197e-1088-45eb-bbf4-c3970d45fd6e" title="test" class="lightbox"></drupal-entity>

When I save the page it renders as something like

<article class="embedded-entity"><img src="/sites/default/files/2018-08-18%2019_42_02-Road%20Bike%20Cycling%2021%20Speed%2026%20Inch%20_%20700CC%20TX30%20BB8%20Double%20Disc%20Brake%20Non-Dampin.png" alt="test" title="test" typeof="foaf:Image" class="img-responsive" /></article>

If I add a class like lightbox or dropshadow to drupal-entity it gets applied to the article tag instead of the img tag. Any way to add classes to inserted images that live in the cool new media functionality? Seems like there are an endless number of use cases where adding classes to inserted images would be crucial.

Thanks to anyone who can help!

  • I upvoted this question because I see a relevant problem here. But I'd recommend to use drupal.org/project/paragraphs or any other modular approach instead to build content. IMHO you should not use CKEditor (or body fields) to place anything else than text in it. Especially when it comes to images. Desired media fields add so much more flexibility to handle them. Thinking of responsive image styles at first.
    – leymannx
    Sep 4, 2018 at 21:46
  • Someone in the drupal community whipped up a contrib module to move the class from the article tag to the subordinate image tag, and their solution seems to work: drupal.org/forum/support/post-installation/2018-08-31/… (PS, yes we do also use paragraphs) Sep 5, 2018 at 19:23
  • Not bad! Maybe you can ask them to drop their answer here so we can upvote and accept it.
    – leymannx
    Sep 5, 2018 at 19:47
  • Darn it, I discovered his contrib module was also adding whatever class I would add to drupal-entity(like lightbox) to other images on the same page (but not all of them), so we're not quite there yet. Sep 5, 2018 at 21:20


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Browse other questions tagged or ask your own question.