Вставка html entites в текстовые ноды

Делюсь еще одним лайфхаков, как в плагине CKE5 вставить htmlentity.

При вставке текста в модель, CKEditor будет преобразовывать html символы вроде ‘&’ и ‘>’. Но что делать, если нужно вставить символ в виде html кода?

Рассмотрим следующий код, который реализует команды для модуля вставки символов, который мне нужно было разработать.

TextData поступает в функцию как параметр options.code. И обычно содержит код в html entity. Вроде ™ или 🔍.

Если я буду просто вставлять текст как:

То, символ ‘&’ будет преобразован в ‘&’ и в HTML мы не получим закодированного символа. Потому мы используем преобразование с помощью поля textarea.

Этот трюк позволяет достичь желаемого эффекта при вставке html entities без сложных манипуляция с моделью.

На самом деле в html код вставляется уже не htmlentity, а результат преобразования в UNICODE, потому это и работает.

Мало букафф? Читайте есчо !

Создание плагина CKEditor 5 в экосистеме Drupal 10

Февраль 8, 2024 г.

Drupal 10 добавил в ядро модуль wysiwyg CKEditor 5. Т.е. уже из "коробки" у вас есть редактор html кода. API CKEditor 4 и 5 версий значительно отличаются, ...

Читать

Добавляем настройки к js плагину CKEditor 5 в Drupal

Март 19, 2024 г.

Когда вы настраиваете форматы текстов, то кроме добавления иконок в toolbar wysiwyg, вы можете видеть набор настроек для разных плагинов CKEditor. Посмотрим ...

Читать

CKEditor5: удаление элемента при удалении в нем текста (элементов)

Февраль 3, 2025 г.

Пример работы в экосистеме CKE5. Реализуем в нашем плагине обработку изменения данных в модели редактора. При удалении всего текста в инлайновом элементе, удалим сам inline контейнер. Зацепку поместим в init секцию плагина. [crayon-68e4056798333591170126/] ...

Читать

Убираем вставку   в пустые div контейнеры в CKEditor 5

Апрель 9, 2025 г.

Неприятная особенность CKEditor - добавляет в пустые контейнера (в <div>,<p> и т.п.) html код неразрывного пробела. Покажу как можно от этого избавиться через код в кастомном плагине для CKEditor 5 в экосистеме Drupal 8+. Нам понадобится ...

Читать
 

Комментарии к «Вставка html entites в текстовые ноды»

Понравилась статья? Есть вопросы? - пишите в комментариях.



Комментарий: