Hi, I'm trying to add a custom button in my editor that put html tags around a user selection, for styling purposes (just like bold, italic.. buttons do).
I have to wrap the text with two span tags, which have a style attribute with some css..
I'm able to do the reverse process (remove those span tags on a "styled" text), but I'm stuck with adding them.
I made a plugin like this:
that it works on normal text, but if the selected text is inside <em>, other <span>, etc.. it loses all of them.
I believe I should use Ranges, but I don't know how. I don't know javascript very well, but I can't find a solution (searched on google, stackoverflow, in this forum..) and it's driving me mad.
thank you in advance!
I have to wrap the text with two span tags, which have a style attribute with some css..
I'm able to do the reverse process (remove those span tags on a "styled" text), but I'm stuck with adding them.
I made a plugin like this:
(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 }); } }); })();
that it works on normal text, but if the selected text is inside <em>, other <span>, etc.. it loses all of them.
I believe I should use Ranges, but I don't know how. I don't know javascript very well, but I can't find a solution (searched on google, stackoverflow, in this forum..) and it's driving me mad.
thank you in advance!
Re: Wrap a selection with tags
someone?