Hi Folks,
Is it possible for the editor's toolbar to be displayed permanently and to render it's editable area (the body I guess) when it is dynamically attached to target (text area, div, etc).
Now -the last part works well: ckeditor can be dynamically attached to many different targets. However - when it is attached it always appears with the target area selected with a relatively thick border surrounding it. And when it is detached, it disappears altogether.
What we need is the editor's toolbar to be rendered but without that lower body being displayed. Only when a target is selected, will the gray container surrounding the editable area appear. Alternately - when the target is de-selected, the gray border surrounding the editable area will disappear but the editor's toolbar will still remain.
Also - since ckeditor is configurable, is there any way for the borders of this area to be downsized? They take up quite a bit of space and it would be great to decrease their width.
Thanks in advance for any help on these issues.
John
Is it possible for the editor's toolbar to be displayed permanently and to render it's editable area (the body I guess) when it is dynamically attached to target (text area, div, etc).
Now -the last part works well: ckeditor can be dynamically attached to many different targets. However - when it is attached it always appears with the target area selected with a relatively thick border surrounding it. And when it is detached, it disappears altogether.
What we need is the editor's toolbar to be rendered but without that lower body being displayed. Only when a target is selected, will the gray container surrounding the editable area appear. Alternately - when the target is de-selected, the gray border surrounding the editable area will disappear but the editor's toolbar will still remain.
Also - since ckeditor is configurable, is there any way for the borders of this area to be downsized? They take up quite a bit of space and it would be great to decrease their width.
Thanks in advance for any help on these issues.
John
Re: Floating Editor with dynamic attach points
Not answering a post on a fundamental issue is understandable if you are busy - which I am sure you are. However, it sure looks like CKeditor has foundational design assumptions that are not being addressed and which are highlighted by this post. I really hope I am wrong in this - but tt appears that CKeditor thinks that it can only exist and be rendered on a page if it has been associated with a target editable area which must then be wrapped in a thick gray outline. (I am sure that the outline is configurable - but that is not the core issue). It also assumes that the editable area will be the entire page or site under construction. Both these assumptions may not always be the case. In a complex RIA with tabs, accordions, floating panes, content panels, etc - there may be more than one target area in more than one widget that needs content. As such the editor may be attached to any selected dom node contained in any widget in the application.
Now - I have one such application and yes I can attach the editor to any dom node. However, the editor cannot be made a part of the application without first attaching it to something. And when it does, it asserts it's presence by appearing out of nowhere and then wrapping it's long gray arms around it's target. This is not desired behavior.
Basically the editor's toolbar is only present when it is attached to an editable dom node: textarea, div, etc. This fundamental design decision - while totally understandable - leaves out situations where the editor is part of an application and is dynamically attached to an editable area by the user. This asynchronous model is more in keeping with ms-word, eclipse or any other non-JS application / editor in the market.
CKEditor has a lot of great functionality and I am hoping there is a workaround or a simple solution to this problem, which I have overlooked. If not - are we then left with the consequences of design decisions that limit the capabilities of an otherwise great tool?
John
Re: Floating Editor with dynamic attach points
I don't think that the people might be able to give you an answer because your post is quite hard to understand.
Those "long gray arms" are just CSS, so you just have to start Firebug and adjust the stylesheet to you taste, in the same way you can change the rest of the colors, pictures... create your own skin and make it fit in your site.
There's no need to use the predefined toolbar, if you have very specific needs you can create your own one and place it in anywhere that you like, with the buttons and behaviors that you want. Check the API.html sample for a simple example with some input buttons.
And of course, in most of the cases the people use CKEditor to edit just a part of a page, not the whole page. It's just a matter of having in your page the proper structure to enable the editing and a little of imagination about how to do things. It's impossible for CKEditor to address every imaginable situation where people might want to use it, so it provides by default something that works for most of the people and then the APIs to allow the rest of the people create their own specific magic that makes their CMS different than the rest.
BTW, did you found the problem with Firefox 4?
viewtopic.php?f=11&t=22736
Re: Floating Editor with dynamic attach points
What I want is the editor to be permanently displayed but not attached to any editable area or attached to an invisible editable area such that it resides permanently on screen but without it's highlight box (for want of a better word) - being displayed. And only when an area is selected will the highlight box surrounding the editable area - be rendered.
If the only way to do this is using CSS to enable and disable the highlight box could you please point me to the documentation which indicates how this may be done.
Thanks for your help.
John
Re: Floating Editor with dynamic attach points
That way you'll always have an editor available on screen.
If you want to change the default colors, then as I said use Firebug or the tools available for whatever browser you are using, inspect the editor elements and change them to fit your needs, then add those changes to your stylesheet and you're done.
Re: Floating Editor with dynamic attach points
The first row is the cke_toolbox - and its role is the toolbar.
The second row is the cke_contents and the table cell / column has a default height of 200px
The third row is cke_bottom and contains the footer.
Playing around with these dom nodes using firebug, I deleted the second and third rows (not recommended perhaps but performed in the interest of experimentation). What remains after this operation is what I am looking for - the toolbar without the cke_contents and cke_bottom rows.
The question remains: can I configure ckeditor - using CSS or configuration parameters to render variable rows? If so - I can then render the editor without its cke_contents iframe and the cke_bottom row (or with these rows minimized). Later when a node really needs to be edited the editor can be attached to it with the cke_contents and cke_bottom rows. Is this allowable or recommended? It looks to me like it is playing with ckeditors fundamental design. However, in principle, it is what I am looking for.
What do you think?
Thanks,
John
Re: Floating Editor with dynamic attach points
What you say that you want "an editor without gray box", it's just the toolbar. That's not an editor.
You can take a look at the shared spaces samples to see one example about how it can be rendered in a different way.
If that's not enough for you, then you can opt to render the editors without their default toolbar and create one of your own, and using the API perform the actions on the editors (the gray areas) that you create afterwards.
Re: Floating Editor with dynamic attach points
I am not saying that this is a bad tool. It clearly is not, and I greatly appreciate the level of thought and expertise built into this tool. There is a great deal to like about ckeditor and I want to use it more not less. That is why I am asking for ways that might make it conform to a more standardized model. Or at least be configured to have those behaviors. However, given your answers to my questions, I do regret bringing this topic up. Consider it closed.
John
Re: Floating Editor with dynamic attach points
See below for the code snippet:
CKEDITOR.config.editingBlock = false;
Although ckeditor still places a div on the bottom, nonetheless it renders without the editing box and lives / renders in the div (topSpace) provided for it.
Now - when an editable area is selected (by double-click events, onfocus events, etc) - the editingBox can be enabled:
And there it is.
John