I have a textarea that needs three div tags added around the content, in order for the CSS to appear correctly. Here is an example of what I am talking about:
Original Textarea
----------------------------
<div class="items">
<div class="item">
<div class="holder">
<div class="frame">
<div class="img-holder">
<img alt="image description" src="/sites/all/themes/XXXXXXX/images/img03.jpg" /></div>
<div class="number">
1</div>
<div class="title">
<h3> Title </h3>
</div>
<div class="txt-holder">
<p>Line one Content</p>
<p>Line two Content</p>
</div>
</div>
</div>
</div>
</div>
------------------------------------
In order for the CSS to display correctly in CKEditor, I need to wrap that with three extra DIV tags. HOWEVER, I do NOT need those DIV tags saved to the database.
This is what I need it to be when editing (bolded the extra DIV tags):
------------------------------------
<div id="wrapper">
<div id="main">
<div id="content">
<div class="items">
<div class="item">
<div class="holder">
<div class="frame">
<div class="img-holder">
<img alt="image description" src="/sites/all/themes/XXXXXXX/images/img03.jpg" /></div>
<div class="number">
1</div>
<div class="title">
<h3> Title </h3>
</div>
<div class="txt-holder">
<p>Line one Content</p>
<p>Line two Content</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
--------------------------------
But when it submits, I need it to strip out those extra tags, so that it looks like the original. Is there something in CKEditor that will do this already, or do I need to do this in the PHP that I write?
Original Textarea
----------------------------
<div class="items">
<div class="item">
<div class="holder">
<div class="frame">
<div class="img-holder">
<img alt="image description" src="/sites/all/themes/XXXXXXX/images/img03.jpg" /></div>
<div class="number">
1</div>
<div class="title">
<h3> Title </h3>
</div>
<div class="txt-holder">
<p>Line one Content</p>
<p>Line two Content</p>
</div>
</div>
</div>
</div>
</div>
------------------------------------
In order for the CSS to display correctly in CKEditor, I need to wrap that with three extra DIV tags. HOWEVER, I do NOT need those DIV tags saved to the database.
This is what I need it to be when editing (bolded the extra DIV tags):
------------------------------------
<div id="wrapper">
<div id="main">
<div id="content">
<div class="items">
<div class="item">
<div class="holder">
<div class="frame">
<div class="img-holder">
<img alt="image description" src="/sites/all/themes/XXXXXXX/images/img03.jpg" /></div>
<div class="number">
1</div>
<div class="title">
<h3> Title </h3>
</div>
<div class="txt-holder">
<p>Line one Content</p>
<p>Line two Content</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
--------------------------------
But when it submits, I need it to strip out those extra tags, so that it looks like the original. Is there something in CKEditor that will do this already, or do I need to do this in the PHP that I write?
Re: Wrap textarea's with DIV tags to make CSS work
Re: Wrap textarea's with DIV tags to make CSS work
Main immediate symptom is that CKEditor area is rendering the background texture of the theme's surrounds instead of the plain white background of actual page content. Other anolamlies are bound to exist, presumably because CKEditor believes it is operating between <body></body> tags and knows nothing of all the DIV tags and classes etc. that are actually wrapped around it (it's CSS context).
I presume there is a way to tell CKEditor its CSS context or to get it to inherit it's context. Otherwise CKEditor is not a WYSIWYG editor.
As I am using CKEditor in a CMS (Content Management System) site "You have to do it in your [HTML?] code" does not help me. But config file or commands or possibly calling parameters (would require editing a Drupal module) may help.
This is not a unique problem by a long chalk, so does anyone know how to get CKEditor to behave as if between <DIV id="name"><DIV class="name"> tags?
I'm using:-
Drupal 6.15
WYSIWYG 6.x-2.x-dev {interface for 3rd party WYSIWYG editors}
CKEditor 3.1
Re: Wrap textarea's with DIV tags to make CSS work
ckeditor wysiwygarea body (css) wrappers
There are lots of posts about this subject, but none ever offered a solution.
I decided to dive into the ckeditor core code myself and came up with a simple modification that works like a charm.
for details see my ckeditor ticket:
https://dev.ckeditor.com/ticket/9774
the actual ckeditor code changes:
https://dev.ckeditor.com/attachment/ticket/9774/bodywrap.patch
(note that this 'patch' is applied to ckeditor 3.6.2)