Hey, all. I've been working on a plugin to essentially duplicate and expand the functionality of fakeobjects -- a placeholders plugin for working with text nodes. When I'm all done with my project, integrating CKEditor into Dreamwidth, I plan on posting a tutorial since this kind of thing probably comes up a lot.
Anyway, I was hoping someone more advanced than me could help out with a stumbling block I've run into.
I'm using a datafilter to grab an element, in this case <cut>, and replace it with a styled <div> for the WYSIWYG view; then, in source mode, it turns back into the <cut> element that users were expecting. (It's basically jump text, if you're familiar with blogs but not with LiveJournal/Dreamwidth.) This part works fine. The only problem is that DIV is a block-level element and <cut> is not. (So when the datafilter switches them, CKEditor suddenly thinks it needs to wrap <cut> in <p>'s, which causes a jarring visual effect where empty <p>'s will crop up every time.
This wouldn't be happening if I could get CKEditor to recognize the <cut> as a block-level element, and I really need it to do that -- <cut> needs to be able to contain <p>'s, and <table>'s, and <div>'s.
ANYWAY. I managed to trick CKEditor into believing a different custom element was a SELF-CLOSING element by adding this to the top of my plugin:
CKEDITOR.dtd.$empty['customelementnamehere'] = 1;
Re: Forcing a custom element to be a BLOCK-level element
Re: Forcing a custom element to be a BLOCK-level element
Well, like I said, I really need it to be a block-level element. It doesn't make any sense for the Dreamwidth-specific <cut> tag to be inside of <p>'s. It needs to be able to contain <p>'s.
Re: Forcing a custom element to be a BLOCK-level element
Re: Forcing a custom element to be a BLOCK-level element
I've created a new element called <secao> used in Source mode that has only one attribute called "nome", so my element is used this way:
Inside this tag, I can have many others elements including another <secao>. My <secao> tag works like a Fieldset element (a wrapper with a label).
Well, to represent it in Visual mode, I created a few elements used in this structure:
To achieve what I want, I'm using some customized DTD like this:
Well, everything is working all right, but my problem is this:
When I walk around my text using keyboard arrow keys, I can't edit my "secaotitle" element but I can walk inside with cursor inside this. When CKEditor recognizes I'm walking inside my textnode inside "secaotitle" it automatically wraps <p> around this textnode and brokes.
How do I avoid this anoying <p> wrapping my textnode inside my custom element "secaotitile"?