¿Cómo configurar ckeditor para no envolver el contenido en el bloque<p>?

wrap

Question

Estoy usando ckeditor en mi sitio web para que sea más fácil para los usuarios ingresar HTML.

Sin embargo, los datos que obtengo de ckeditor están envueltos en bloques <p></p> . (Que no quiero).

¿Hay algún ajuste de configuración que obligue al editor a no ajustar el texto en nada?

Answer 1

Agregue lo siguiente a su archivo config.js para CKEditor:

config.enterMode = CKEDITOR.ENTER_BR;

Ejemplo:

...

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

    ...
};

Detalles

La configuración de configuración que controla este comportamiento se basa en lo que desea que ocurra cuando el usuario presiona Intro .

En caso de que alguien que es nuevo en el trabajo con HTML lea esto, estoy incluyendo una explicación básica de los conceptos involucrados y por qué será necesario insertar una etiqueta cuando se presiona la tecla Intro .

Sabemos que si ingresamos algo de texto en un documento HTML y luego colocamos texto adicional en una nueva línea, el navegador no mostrará el texto como dos líneas, ignorará cualquier retorno de carro y condensará múltiples espacios entre caracteres a una sola espacio.

El siguiente HTML:

qwer
tyui

Será rendido como:

qwer tyui

Por lo tanto, el editor debe insertar una etiqueta HTML para indicar al navegador que debe mostrar el segundo grupo de texto en una nueva línea.

La configuración que controla esto es config.enterMode y ofrece tres opciones:

1 - Insertar párrafo

La configuración predeterminada crea un elemento de párrafo cada vez que se presiona Entrar :

config.enterMode = CKEDITOR.ENTER_P; // inserts `<p>...</p>`

2 - Insertar ''div''

Puedes elegir crear un elemento div lugar de un párrafo:

config.enterMode = CKEDITOR.ENTER_DIV; // inserts `<div></div>`

3 - Insertar break (la configuración que estás buscando)

Si prefiere no ajustar el texto en nada, puede optar por insertar una etiqueta de salto de línea:

config.enterMode = CKEDITOR.ENTER_BR; // inserts `<br />`

La documentación de CKEditor indica que no se recomienda utilizar la configuración ENTER_BR :

Nota: Se recomienda utilizar la configuración CKEDITOR.ENTER_P debido a su valor semántico y corrección. El editor está optimizado para esta configuración.

Otra configuración relacionada ''autoParagraph''

Hay una segunda configuración que controla una situación similar: config.autoParagraph . La forma en que funciona depende de la configuración config.enterMode discutida anteriormente.

autoParagraph determina si los elementos en línea, como el span se envuelven en el elemento de bloque ( p o div ) especificado por la configuración enterMode . El valor predeterminado es envolver los elementos en línea, por lo que si ingresa un intervalo como este (como HTML):

<span>asdfg</span>

Será envuelto en un elemento ap o div como este:

<p><span>asdfg</span></p>

o esto:

<div><span>asdfg</span></div>

El elemento en línea no se ajustará si lo configura como false o si establece enterMode en CKEDITOR.ENTER_BR .

La documentación de CKEditor incluye esta nota sobre config.autoParagraph :

Nota: Cambiar el valor predeterminado podría introducir problemas de usabilidad impredecibles.

Aún más configuraciones

Hay tres configuraciones más que están algo relacionadas con este tema:

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

Referencia

Una lista completa de las opciones de configuración disponibles se puede encontrar aquí:

• CKEDITOR.config - Documentación de la API de JavaScript CKEditor 3
• CKEDITOR.config - Documentación CKEditor 4

Answer 2

Esto se responde perfectamente bien arriba, sin embargo, como se mencionó, realmente no debería estar cambiando esto en la configuración principal.

La forma correcta de hacer esto es realmente .replace.

es decir

    <form name="title" method="post" action="<?php echo htmlentities($_SERVER[''PHP_SELF'']);?>">
    <textarea id="editor2" name="editor2" rows="300"><?php echo $editor2;?></textarea>
    <textarea id="editor1" name="editor1" rows="1" cols="50" onfocus="this.value=''''; this.onfocus=null;">Type Tab Title Here:</textarea>
    <input type="submit" value="Submit">
    </form>

<script type="text/javascript">  
    CKEDITOR.replace( ''editor2'', { 
    enterMode: CKEDITOR.ENTER_BR, 
    on: {''instanceReady'': function (evt) { evt.editor.execCommand(''maximize'');     }},
    });      
    </script>

Answer 3

Sé que llego un poco tarde al juego, pero creo que la opción que busca el OP es:

config.autoParagraph = false;

Answer 4

Una solución muy simple sin ningún cambio de configuración es utilizar

1. shift + enter para un salto de línea <br> , y
2. simplemente enter causaría un nuevo párrafo.

La ventaja es que no tienes que hacer ningún cambio de configuración. Además, tienes ambos.

Answer 5

Si desea excluir la etiqueta <p> y desea solo una herramienta de edición básica como Bold Italic superscript Subcript, etc. en Ckeditor, siga estos pasos:

Estoy 100% seguro de esto ya que investigué 36 Horas continuamente :)

Paso 1: Agregue este script en su página web PHP

<script type="text/javascript">  
    CKEDITOR.replace( ''editor1'', { 
    enterMode: CKEDITOR.ENTER_BR, 
    on: {''instanceReady'': function (evt) { evt.editor.execCommand('''');}},
    }); 
</script>

Paso 2: agregar id="editor2" y onfocus="this.value='''';" en tu área de texto como esta

<textarea id="editor2" name="AsYourWish" onfocus="this.value='''';">

Paso 3: Asegúrese de eliminar Class="ckeditor" de Textarea.

Paso 4: vuelva a cargar su página web si no sucedió Eliminar caché / historial y reiniciar PC / portátil.

Paso 5: Está Hecho :)