plugin - ¿Cómo definir las etiquetas permitidas en CKEditor?
ckeditor last version (6)
A veces, los usuarios copian y pegan texto de diferentes fuentes a CKEditor, pero quiero restringir qué etiquetas pueden copiar a CKEditor.
Solo necesito usar ciertas etiquetas en CKEditor: la etiqueta de lista, etiqueta de rotura, etc.
¿Puedo definirlos y deshabilitar las otras etiquetas en CKEditor?
Hay algunas configuraciones que puedes usar. Usted define estas configuraciones editando el archivo config.js en el directorio raíz del ckeditor. Por ejemplo, si quieres ser radical como yo, podrías poner:
config.forcePasteAsPlainText = true;
Si desea restringir solo ciertas etiquetas exactamente como dijo, encontré la siguiente configuración:
config.removeFormatTags = ''b,big,code,del,dfn,em,font,i,ins,kbd'';
Lo último se hará solo cuando el usuario ejecute el comando "eliminar formato". Más información: http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.format_tags
Teniendo en cuenta todo el tiempo, creo que ya ha encontrado su respuesta, pero se puede ayudar a otros.
Para agregar mi entrada, hay desde 4.1 la función Filtro de contenido avanzado, que permite reglas muy específicas para el contenido permitido (qué etiquetas y qué estilos / atributos / clases para ellas). Me parece muy potente y muy agradable de configurar.
Lea más en docs.ckeditor.com/#!/guide/dev_advanced_content_filter pero aquí hay algunos ejemplos de la página
config.allowedContent = true; // to allow all
// A rule accepting <p> and <h1> elements with optional "left" and "right" classes.
// Note: Both elements may contain these classes, not only <h1>.
config.allowedContent = "p h1(left,right)";
// Rules allowing:
// * <p> and <h1> elements with an optional "text-align" style,
// * <a> with a required "href" attribute,
// * <strong> and <em> elements,
// * <p> with an optional "tip" class (so <p> element may contain
// a "text-align" style and a "tip" class at the same time).
config.allowedContent = "p h1{text-align}; a[!href]; strong em; p(tip)";
Puede usar el complemento de la lista blanca para definir en su configuración una lista de elementos y atributos permitidos y negar cualquier otra cosa.
Básicamente, es la misma solución presentada por Paul Tomblin, pero debería ser más fácil manejar más elementos en lugar de copiar un montón de código y en lugar de una lista negra, utiliza una lista blanca para que se elimine todo lo que no esté permitido.
Simplemente hice esto para asegurarme de que nadie pudiera poner una etiqueta <input> en el editor. Probablemente podría extenderse a otras etiquetas:
CKEDITOR.on(''instanceReady'', function(ev)
{
var editor = ev.editor;
var dataProcessor = editor.dataProcessor;
var htmlFilter = dataProcessor && dataProcessor.htmlFilter;
htmlFilter.addRules(
{
elements :
{
input: function(element)
{
return false;
},
}
});
});
strip_tags una selección limitada de etiquetas html directamente a la operación de pegar, usando el método strip_tags de phpjs.org.
CKEDITOR.on(''instanceReady'', function(ev) {
ev.editor.on(''paste'', function(evt) {
evt.data[''html''] = strip_tags(evt.data[''html''],
''<i><em><b><strong><blockquote><p><br><div><ul><li><ol>'' // allowed list
);
});
});
function strip_tags (input, allowed) {
// http://phpjs.org/functions/strip_tags (http://kevin.vanzonneveld.net)
allowed = (((allowed || "") + "").toLowerCase().match(/<[a-z][a-z0-9]*>/g) || []).join(''''); // making sure the allowed arg is a string containing only tags in lowercase (<a><b><c>)
var tags = /<//?([a-z][a-z0-9]*)/b[^>]*>/gi,
commentsAndPhpTags = /<!--[/s/S]*?-->|</?(?:php)?[/s/S]*?/?>/gi;
return input.replace(commentsAndPhpTags, '''').replace(tags, function ($0, $1) {
return allowed.indexOf(''<'' + $1.toLowerCase() + ''>'') > -1 ? $0 : '''';
});
}
CKEDITOR.config.fullPage = false
Indica si los contenidos a editar se están ingresando como una página HTML completa. Una página completa incluye los elementos <html> , <head> y <body> . La salida final también reflejará esta configuración, incluidos los contenidos <body> solo si esta configuración está deshabilitada.