- Issue created by @pcate
- πΊπΈUnited States pcate
Just a followup. The embed is not displaying in CKEditor 5 appears to be because the actual module's
lite_youtube_embed
library isn't loading when the CKEditor 5 media embed is added. Thelite-youtube
element is inserted, but without the JS/CSS it isn't obviously displaying anything. When I manually loaded the library on all pages in a quick custom module, the embed element does render.Another issue is however that CKEditor 5 inserts the
lite-youtube
element in afigure
tag that hasdisplay: table
. That causes the sizing of the thumbnail to be tiny. - π¦πΉAustria agoradesign
well, that's not really a CKE5 specific problem. This is a general problem with embedded media: see β¨ CKEditor embedded media previews do not render with attached assets Active and #3085273: [Meta] Preview embedded media / entities in ckeditor β . However I am not against including a workaround inside this module, as long as it's a quite elegant one
- πΊπΈUnited States pcate
However I am not against including a workaround inside this module, as long as it's a quite elegant one.
For the library loading, one option would be create a simple CKEditor 5 plugin that loads the library when the media embed plugin is enabled. I think that can be achieved with a simple `lite_youtube_embed.ckeditor5.yml` file. Something like:
media_lite_youtube_embed: provider: media ckeditor5: plugins: - drupalMedia.DrupalMedia drupal: label: lite_youtube_embed library: lite_youtube_embed/lite_youtube_embed elements: - <lite-youtube> - <lite-youtube videoid playlabel params> conditions: filter: media_embed
The second issue with the
figure
tag with
display: table
might be more difficult...
- π¦πΉAustria agoradesign
would be great, if you could verify your proposed fix.. unfortunately I cannot use CKE5 (and therefore also D10) atm, as we use linkit module in all our projects, and it is lacking CKE5 support unfortunately. hope this will get fixed soon
- πΊπΈUnited States pcate
would be great, if you could verify your proposed fix
Loading the library via a CKEditor5 yaml config file does appear to work. It doesn't solve the
figure
anddisplay: table
issue however. - πΊπΎUruguay rpayanm
The code here worked for me:
https://www.drupal.org/project/drupal/issues/3072317#comment-14926967 β¨ CKEditor embedded media previews do not render with attached assets Activefunction mymodule_support_preprocess_page(&$variables) { if (\Drupal::service('router.admin_context')->isAdminRoute()) { $variables['#attached']['library'][] = 'mymodule_support/ckeditor5_fixes'; } }
document.body.addEventListener('click', (e) => { // Prevent opening colorbox images in the current tab while in the editor. if (e.target.parentElement.classList.contains('colorbox')) { e.preventDefault(); } });