#3308035: The first attempt to make it works with Ckeditor5
Closes #3308035
Merge request reports
Activity
- Resolved by Alexey
added 1 commit
- 4e83fa64 - Add info about the version to the plugin's library
- src/Plugin/CKEditor4to5Upgrade/Btbutton.php 0 → 100644
1 <?php 2 3 declare(strict_types=1); 4 5 namespace Drupal\ckeditor_bootstrap_buttons\Plugin\CKEditor4To5Upgrade; changed this line in version 4 of the diff
- src/Plugin/CKEditor4to5Upgrade/Btbutton.php 0 → 100644
19 * }, 20 * cke5_plugin_elements_subset_configuration = { 21 * } 22 * ) 23 * 24 * @internal 25 * Plugin classes are internal. 26 */ 27 class Btbutton extends PluginBase implements CKEditor4To5UpgradePluginInterface { 28 29 /** 30 * {@inheritdoc} 31 */ 32 public function mapCKEditor4ToolbarButtonToCKEditor5ToolbarItem(string $cke4_button, HTMLRestrictions $text_format_html_restrictions): ?array { 33 // We use the Core's Ckeditor 5 Link button instead custom button in the new version. 34 throw new \OutOfBoundsException(); changed this line in version 4 of the diff
26 'description' => t('CKEditor Bootstrap Buttons requires the btbutton library. 25 if (!$library_found) { 26 $requirements['ckeditor_bootstrap_buttons'] = [ 27 'title' => t('CKEditor Bootstrap Buttons library missing'), 28 'description' => t('CKEditor Bootstrap Buttons requires the btbutton library. 27 29 Download it (https://github.com/smonetti/btbutton) and place it in the 28 30 libraries folder (/libraries)'), 31 'severity' => REQUIREMENT_ERROR, 32 ]; 33 } 34 } 35 36 // Requirements for the Ckeditor 5. 37 if (\Drupal::moduleHandler()->moduleExists('editor_advanced_link')) { 38 $requirements['ckeditor_bootstrap_buttons'] = [ 39 'title' => t('Please to disable the Editor Advanced Link module'), changed this line in version 6 of the diff
26 $requirements['ckeditor_bootstrap_buttons'] = [ 27 'title' => t('CKEditor Bootstrap Buttons library missing'), 28 'description' => t('CKEditor Bootstrap Buttons requires the btbutton library. 27 29 Download it (https://github.com/smonetti/btbutton) and place it in the 28 30 libraries folder (/libraries)'), 31 'severity' => REQUIREMENT_ERROR, 32 ]; 33 } 34 } 35 36 // Requirements for the Ckeditor 5. 37 if (\Drupal::moduleHandler()->moduleExists('editor_advanced_link')) { 38 $requirements['ckeditor_bootstrap_buttons'] = [ 39 'title' => t('Please to disable the Editor Advanced Link module'), 40 'description' => t('CKEditor Bootstrap Buttons for Ckeditor 5 41 can\'t work with the enabled Editor Advanced Link module currently. changed this line in version 6 of the diff
Hi I have a little problem trying to do the test. Maybe somebody can help me to fixit.
I've checkout to this issue branch with
git fetch "git@git.drupal.org:issue/ckeditor_bootstrap_buttons-3308035.git" '3308035-version_for_drupal10' git checkout -b 'ckeditor_bootstrap_buttons-3308035-3308035-version_for_drupal10' FETCH_HEAD
and moved the plugin folder to /web/modules/contrib. I could find and install the module correctly from drupal, but the new button to use the plugin does not appear in the ckeditor toolbar configuration view.
I even tried adding the btbutton plugin to the library folder (from README.md), although I suspect this plugin is required for the ckeditor4 version.
do you know where the error is?
I tested this and it's... progress, but still needs work.
I was able to use it with the existing
editor_advanced_link
options, but it somehow makes things all out of order.I'd say overriding the Editor Advanced options is a dealbreaker, so would it be possible for us to hook into their options and somehow merge the Bootstrap options into the Advanced options? I've dug around a little, but need to get much deeper into the CKE5 plugin architecture to figure this out.
I did a little noodling in the browser, I wonder if this would be possible?
- CSS classes should still be allowed, but merged with the button classes.
- "Bootstrap button" switch expands the fields
- Color/Size/Style stay text fields for extensibility/compatibility between bootstrap versions
- Add link to Bootstrap docs to help editors find the right options, possibly configurable based on the version of Bootstrap in the theme.
22 22 default: 23 23 } 24 24 } 25 26 /** 27 * Implements hook_preprocess_html(). 28 */ 29 function ckeditor_bootstrap_buttons_preprocess_html(&$variables) { 30 $variables['#attached']['library'][] = 'ckeditor_bootstrap_buttons/bootstrap-5-js'; This needs more specificity so that it's only added in the context of the editor. Adding bootstrap to every page is not advised, and can result in issues like this one: https://www.drupal.org/project/drupal/issues/3326215
Updated: Perhaps this should be left, but change the file connection for this library. At the moment, we only need styles for buttons, instead we pull ALL styles, which is not very correct and causes problems on admin pages as well. Therefore, we can try to compile the styles for buttons in the module itself, and also replace the connection of the entire Bootstrap js with the connection only for buttons js in Bootstrap. What do you think about this?
Edited by Vlad Denysiuk