Ciao,
sto cercando di aggiungere un pulsante al mio CKeditor che mette dei tag html attorno alla selezione dell'utente, in modo da poterli utilizzare per applicare stili css personalizzati al testo. Dovrei mettere due tag span con attributo style..
Son riuscito a far funzionare il processo inverso (da un testo con quei tag, toglierli), ma non riesco a farli aggiungere in modo corretto.
Ho fatto un plugin del genere:
codice:
(function(){
var a= {
exec:function(editor){
var selection = editor.getSelection();
var el = selection.getStartElement();
var parent = el.getParent();
var text = parent.getText();
if (el && parent.hasClass("ymarker")) {
el.remove(true);
parent.remove(true);
} else {
var save = selection.getNative();
var element = CKEDITOR.dom.element.createFromHtml( '<span class="ymarker" style="background: url(".../images/ymarker_right_corner.gif") no-repeat scroll right center transparent; height: 12px; padding-right: 6px; position: relative; left: -8px; margin-right: -12px;"><span style="background: url(".../images/ymarker_left_corner.gif") no-repeat scroll 0px 6px transparent; padding: 0pt 0pt 0pt 8px;">' + save + '</span></span>' );
editor.insertElement(element);
}
}
},
b="marker";
CKEDITOR.plugins.add(b,{
init:function(editor){
editor.addCommand(b,a);
editor.ui.addButton("marker",{
label:"Marker",
icon: this.path + "marker.png",
command:b
});
}
});
il che funziona su testo "normale", cioè non già racchiuso tra tag tipo [i], [b], altri <span>... ma in questi casi vengono tolti.
penso di dover utilizzare i Ranges, ma non essendo una cima in javascript non so bene come fare (e in giro non ho trovato nessuna soluzione finora). e sul forum ufficiale nessuno mi caga :\
come potrei fare?