Как настроить ckeditor, чтобы не обтекать содержимое в блоке ?

Я использую ckeditor на своем веб-сайте, чтобы пользователям было проще вводить HTML.

Однако данные, возвращаемые из ckeditor, завернуты в блоки

. (Который я не хочу.)

Есть ли какой-то параметр конфигурации, который заставляет редактор не обтекать текст ничем?

Добавьте в файл config.js для CKEditor следующее:

 config.enterMode = CKEDITOR.ENTER_BR; 

Пример:

 ... CKEDITOR.editorConfig = function (config) { config.enterMode = CKEDITOR.ENTER_BR; ... }; 

Детали

Настройка, которая управляет этим поведением, основана на том, что вы хотите, когда пользователь нажимает Enter .

На всякий случай, кто-то, кто работает с HTML, читает это, я включаю в себя некоторое базовое объяснение вовлеченных понятий и почему тег нужно вставлять при нажатии клавиши Enter .

Мы знаем, что если мы введем какой-то текст в документ HTML, а затем добавим дополнительный текст в новую строку, браузер не отобразит текст в виде двух строк, он проигнорирует любые возвраты каретки и сгустят несколько пробелов между символами до одного пространство.

Следующий HTML:

 qwer tyui 

Будет отображаться как:

qwer tyui

Поэтому редактору нужно вставить тег HTML, чтобы сообщить браузеру, что он должен отображать вторую группу текста в новой строке.

Конфигурация, которая управляет этим, – config.enterMode и предлагает три варианта:

1 – Вставить абзац

Значение по умолчанию создает элемент абзаца при каждом нажатии Enter :

 config.enterMode = CKEDITOR.ENTER_P; // inserts `

...

`

2 – Вставить ‘div’

Вы можете создать элемент div вместо абзаца:

 config.enterMode = CKEDITOR.ENTER_DIV; // inserts `
`

3 – Вставить разрыв (настройка, которую вы ищете)

Если вы предпочитаете не обтекать текст ничем, вы можете вставить тег разрыва строки:

 config.enterMode = CKEDITOR.ENTER_BR; // inserts `
`

Документация CKEditor указывает, что использование параметра ENTER_BR не рекомендуется :

Примечание. Рекомендуется использовать параметр CKEDITOR.ENTER_P из-за его семантического значения и правильности. Редактор оптимизирован для этого параметра.

Другая связанная настройка «autoParagraph»

Существует вторая настройка, которая управляет аналогичной ситуацией – config.autoParagraph . Как это работает, зависит от параметра config.enterMode рассмотренного выше.

autoParagraph определяет, autoParagraph ли встроенные элементы, такие как span , в элемент блока ( p или div ), заданный параметром enterMode . По умолчанию используется обертка встроенных элементов, поэтому, если вы введете такой пробел (как HTML):

 asdfg 

Он будет завернут в элемент ap или div следующим образом:

 

asdfg

или это:

 
asdfg

Встроенный элемент не будет обернут, если вы установите для него значение false или если вы установите enterMode на CKEDITOR.ENTER_BR .

Документация CKEditor включает эту заметку о config.autoParagraph :

Примечание. Изменение значения по умолчанию может привести к непредсказуемым проблемам использования.

Еще больше настроек

Есть еще три настройки, которые несколько связаны с этой темой:

  • config.fillEmptyBlocks
  • config.forceEnterMode
  • config.ignoreEmptyParagraph

Справка

Полный список доступных параметров конфигурации можно найти здесь:

  • CKEDITOR.config – Документация API JavaScript CKEditor 3
  • CKEDITOR.config – Документация CKEditor 4

Я знаю, что немного опоздал в игру, но я думаю, что вариант, который ищет OP:

     config.autoParagraph = false;

На это хорошо ответили выше, однако, как уже упоминалось, вы не должны изменять это в основной конфигурации.

Правильный способ сделать это на самом деле.

т.е.

  

Очень простое решение без изменения конфигурации – использовать

  1. shift + enter для разрыва строки, и
  2. просто enter новый пункт.

Преимущество в том, что вам не нужно выполнять какие-либо изменения конфигурации. Кроме того, у вас есть оба.

Если вы хотите исключить

и хотите, чтобы в Ckeditor был только базовый инструмент редактирования, такой как Bold Italic indexscript и т. Д., Выполните следующие действия:

Я на 100% уверен в этом, так как я исследовал 36 часов непрерывно 🙂

Шаг 1. Добавьте этот скрипт в свою веб-страницу PHP.

  

Шаг 2: добавьте id="editor2" и onfocus="this.value='';" в вашем текстовом поле, как это

  

Шаг 3: Убедитесь, что из Textarea Class="ckeditor" .

Шаг 4: перезагрузите свою веб-страницу, если этого не произошло. Удалите кеш / историю и перезагрузите компьютер / ноутбук.

Шаг 5: Сделано 🙂

Interesting Posts
Давайте будем гением компьютера.