ckeditor format html code

Evita que CKEditor formatee el código en modo fuente

Question

¿Cómo puede evitar cualquier formateo automático cuando está en CKEditor al ver en modo fuente?

Me gusta editar el código fuente HTML directamente en lugar de usar la interfaz WYSIWYG, pero cada vez que escribo nuevas líneas o etiquetas de diseño como las sangraría, todo se formatea cuando cambio al modo WYSIWYG y luego vuelvo al modo fuente.

Me encontré con un ticket de desarrollo de CKEditor, preservar el formato de los elementos ProtectedSource , que aludía a una configuración que puede haber existido una vez y que sería exactamente lo que estoy buscando. Solo quiero saber cómo puedo desactivar completamente todo el formato automático al editar en modo fuente.

Se me ocurrió una solución que pensé sería infalible (aunque no agradable).

Aprendí acerca de la configuración de protectedSource , así que pensé, bueno, tal vez pueda usar eso y crear una etiqueta de comentario HTML antes de todo mi HTML y otra después y luego insertar una expresión regular para encontrar las etiquetas de comentario en la matriz protectedSource , pero incluso eso (lo creas o no) no funciona.

He probado mi expresión directamente en el navegador fuera de CKEditor y está funcionando, pero CKEditor no protege el código como se esperaba (lo que sospecho es un error que involucra etiquetas de comentarios, ya que puedo hacer que funcione con otras cadenas) ). En caso de que se esté preguntando, esto es lo que esperaba que funcionara como una solución alternativa, pero no lo hace:

config.protectedSource.push( /<!-- src -->[/s/S]*<!-- end src-->/gi );

y lo que planeaba hacer (por lo que parece ser la falta de una configuración para deshabilitar el formateo en modo fuente) fue anidar todo mi HTML dentro de las etiquetas comentadas de esta manera:

<!-- src -->
<div>some code that shouldn''t be messed with (but is)</div>
<!-- end src -->

Me encantaría saber si alguien tiene alguna sugerencia para este escenario, o si conoce alguna de las configuraciones que he descrito, o incluso si alguien me puede informar por qué no puedo protectedSource al protectedSource para que funcione correctamente con dos etiquetas de comentarios. .

Realmente creo que tiene que ser un error porque puedo conseguir que muchas otras expresiones funcionen bien, e incluso puedo proteger HTML dentro del área de una etiqueta de comentario única, pero simplemente no puedo obtener HTML dentro de dos etiquetas de comentarios diferentes para permanecer intacto.

Answer 1

¿Ayuda this respuesta? Básicamente, puedes desactivar las opciones agregando un javascript, parece.

Answer 2

Mi solución a esto fue usar comentarios en mi sistema, pero antes de enviar el contenido de la página a CKEditor, conviértalos a etiquetas HTML personalizadas. Luego, al guardar, conviértalos de nuevo a mis etiquetas de comentarios.

Para tu sintaxis eso sería algo así en PHP. Antes de imprimir el contenido de la página en el área de texto:

$content = str_replace(array(''<!-- src -->'',''<!-- end src -->''),array(''<protected>'',''</protected>''),$content);

Antes de guardar el contenido resultante:

$content = str_replace(array(''<protected>'',''</protected>''),array(''<!-- src -->'',''<!-- end src -->''),$content);

En la configuración de CKEditor:

protectedSource:[/<protected>[/s/S]*<//protected>/g]

¡Espero que ayude!

Answer 3

Quería conservar las nuevas líneas en mi fuente, y la característica protectedSource funciona bien para eso. config.js esto a mi config.js :

config.protectedSource = [//r|/n/g];

Answer 4

Resolví este problema simplemente rodeando la salida de back-end de la página de formulario de edición con una condición condicional en una variable $ _GET. Al hacer clic en "Modo experto", se carga un área de texto simple en lugar del sistema ckeditor. Su invocación del objeto ckeditor variará dependiendo de su configuración. (Tengo una clase personalizada que llama / construye el objeto editor)

                <div id="postdivrich" class="postarea">
<?php
if( isset( $_GET[''expert''] ) )
{
    print "<div style=/"text-align:right;/"><a href=/"/admin/ckeditor/edit.php?node={$nNode}/">Editor mode</a></div>/n";
    print "<textarea name=/"content/" style=/"height:400px;width:{$nEwidth}px;/">{$aDoc[''content'']}</textarea>/n";
}
else
{
    print "<div style=/"text-align:right;/"><a href=/"/admin/ckeditor/edit.php?node={$nNode}&expert=true/">Expert mode</a></div>/n";
    require_once( ''admin/editor.class.php'' );
    $aDoc[''content''] = str_replace( "/r", '''', str_replace( "/n", '''', nl2br( $aDoc[''content''] ) ) );
    $oEditor = new setEditor( $aDoc[''content''], $nEwidth, "400", ''content'' );
    $oEditor->ShowEditor();
}
?>
                </div>

Answer 5

config.allowedContent=true; hará el truco

Aquí está el código HTML completo

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>CKEditor</title>
        <script src="http://cdn.ckeditor.com/4.5.10/standard/ckeditor.js"></script>
    </head>
    <body>
        <textarea name="editor1"></textarea>
        <script>
            CKEDITOR.config.allowedContent=true;
            CKEDITOR.replace( ''editor1'' );
        </script>
    </body>
</html>