Geek asks and answers

How to prevent CKEditor from setting a title in its iframe?

I am using CKEditor as well as the jQuery UI tooltips plugin. What happens is that CKEditor sets the title attribute to its iframe element, and the jQuery tooltips plugin converts it into a tooltip, and then whenever you hover over any part of the editor (which you have to do every time, when you edit the text), the tooltip always shows, saying "Rich Text Editor, elementId".

Even if I set the tooltip plugin selector to "*: not (iframe)", it does it anyway. The only way I've found so far to get it to not set the tooltip for the iframe is to exclude the “div” from the selector, but then I also lose the tooltips for bold / italic, etc. Editor options.

And I cannot find the piece of code in CKEditor Javascript that sets the iframe header, so I could remove it. The only part I found is the actual title bar inside the language files, where I can replace the "Rich Text Editor" with an empty string, but it still sets the iframe title to ", {elementId}".

Any help was appreciated, I would like to leave both plugins.

+5
source share
5 answers

I came across the same problem by developing a custom CMS for another developer, which is unlikely to be needed for reading from the screen in the near future.

Thanks mihaisimi for the pointer. Having delved into the properties of the CKEditor instance a bit, I ended up writing the JS bit below to remove the "Rich text editor, element_id" header from the content area.

CKEDITOR.on("instanceReady", function(e) {
 var $frame = $(e.editor.container.$).find(".cke_wysiwyg_div");
 if($frame) $frame.attr("title", "");
});

So, as soon as CKEditor loads, I wrap the CKEditor container in a jQuery object, I search for the actual content divwith . find () and remove its name with . attr () .

, jQuery. CKEditor 4.1.1 "div". , iframe, , .find(".cke_wysiwyg_div") .find(".cke_wysiwyg_frame").

ckeditor/config.js, . , .

, , .

+8

javascript. . ck 4.0.1 inline , , "webedit", , .

A div :

<div id="webedit1" comment="My own tooltip">

:

CKEDITOR.on( 'instanceReady', function( event ) {
        var editor = event.editor;
        var divElement = event.editor.element.$;

        if(divElement){
            var divComment = divElement.getAttribute("comment");
            if(divComment){
                divElement.title=divComment;
            }
        }
    });

, Mihai

+1

:

$( document ).tooltip({
    items: "input[title],p[title],span[title],td[title],img[title],a[title]",
});

, iFrame!

+1

( ) :

config.title = false;

. http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-title

+1

. , , . wysiwygarea, - .

0

More articles:


All Articles