Solución:
Puede agregar un filtro de procesador html
editor.dataProcessor.htmlFilter.addRules({
elements :{
p : function( element ){
if ( element.className.indexOf("thiny_p") < 0){
element.className += 'thiny_p';
}
}
}
});
Además, si no es necesario crearlo como complemento de ckedito, tal vez antes de enviar contenido al servidor, puede usar jQuery para cambiar el contenido.
$("iframe", "#cke_editor1").contents().find("p").addClass("tiny_p");
o, si textarea (fuente) está activo
var editor= $("textarea", "#cke_editor1");
editor.val(editor.val().replace(/<p>/gi, "<p class="thiny_p">"))
deberías modificar un poco .replace(/<p>/gi, "<p class="thiny_p">") expresión regular para apoyar otros casos.
EDITAR
Finalmente tuve tiempo para descargar y configurar el editor en mi caja, aquí está el complemento que funciona
CKEDITOR.plugins.add( 'customparagraph',
{
init: function( editor )
{
editor.addCommand('addParagraphClassName',{
exec : function( editor ){
var ps = editor.document.$.getElementsByTagName("p");
for (var i=0; i < ps.length; i++){
if(ps[i].className.indexOf("thiny_p") < 0){
ps[i].className += "thiny_p";
}
}
}
});
editor.ui.addButton( 'ThinyP',{
label: 'Appends thiny_p class',
command: 'addParagraphClassName',
icon: this.path + 'images/icon.gif'
});
}
} );
ponlo adentro plugins/customparagraph/plugin.js
también crea una imagen de icono plugins/customparagraph/images/icon.gif
en la configuración, tendrá que agregar las siguientes opciones de configuración config.js de su instalación de CKEdito
CKEDITOR.editorConfig = function( config )
{
config.extraPlugins = "customparagraph";
config.toolbar = [ [ 'ThinyP' ] ]; // add other toolbars and keep in mid this can be overwritten in page which loads CKEditor
};
O
en la página que carga CKEditor
<script type="text/javascript">
//<![CDATA[
// Replace the <textarea id="editor1"> with a CKEditor
// instance, using default configuration.
CKEDITOR.replace( 'editor1',
{
extraPlugins : 'customparagraph',
toolbar :
[
[ 'Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink' ],
[ 'ThinyP' ]
]
});
//]]>
</script>
El usuario deberá hacer clic en el botón de la barra de herramientas antes de guardar
Bueno … no estoy seguro si lo necesita por alguna razón específica … pero ¿no sería la vida mucho más fácil si hace lo que quiere hacer al final de la pantalla?
Por ejemplo, si muestro un texto (guardado de ckeditor) en la interfaz, lo muestro en algo así como un
<div class="ckcontent" > ... </div>
Y todo
<p>
Las etiquetas dentro de él se pueden aplicar estilos o aplicar jquery mediante la notación:
.ckcontent p { margin-left:5px;........ }
O
$('.ckcontent p').addClass('ckparagraphs');