The forum operates in read-only mode. Please head to StackOverflow for support.

Mon, 10/27/2008 - 11:50

mirajdhk

Joined: 27/10/2008

Posts: 2

Writing Multiple Elements in a Single Style in fckconfig.js

I want to write several div elements also with nesting within a single style in FCKCONFIG.JS The code given in the js file is:

FCKConfig.CustomStyles =
{
'Code' : { Element : 'code' },
'DekiScript' : { Element : 'pre', Attributes : { 'class' : 'script' } },
'Comment' : { Element : 'p', Attributes : { 'class' : 'comment' } },
'Box' : { Element : 'div', Attributes : { 'class' : 'divbox' , 'style' : 'background-color:#28B8FC'} },
};

The "Box" above is my new style. Which results like below:
<div class="divbox" style = "background-color:#28B8FC;"></div>

But I want to do something like this:
<div class="divbox" style = "background-color:#28B8FC;">
<div class="div1" style = "background-color:#FFF8FC;">
</div>
<div class="div2" style = "background-color:#8FCFFF;">
</div>
</div>

Can anybody tell me How can I achieve this? :?:

Sun, 11/30/2008 - 20:20

takis

Joined: 29/11/2008

Posts: 12

Re: Writing Multiple Elements in a Single Style in fckconfig.js

All you have to do is expand the FCKConfig.CustomStyles property like this:

FCKConfig.CustomStyles = {
    'divbox' : { Element : 'div', Styles : { 'background-color' : '#28B8FC' } },
    'div1' : { Element : 'div', Styles : { 'background-color' : '#FFF8FC' } },
    'div2' : { Element : 'div', Styles : { 'background-color' : '#8FCFFF' } }
};

And this can go on and on as long as you like. A great feature of the FCK, really...

Tue, 04/06/2010 - 12:35

teson

Joined: 06/04/2010

Posts: 3

Re: Writing Multiple Elements in a Single Style in fckconfig

is it at all possible to define a container in the customstyles that
can handle a new line without ending the style;

ideal html would be:

<div class="infobox">
  <h4>Think about it</h4>
  <p>lorum ipsum</p>
</div>

as far as I've understood fck always ends the style asap,
giving:

<div class="infobox"></div>
<h4>Think about it</h4>
<p>lorum ipsum</p>

I've looked into the "CreateDiv"-button which might solve it
but if it's possible to set an attribute at the styles, not to break the div,
that would be a much more intuitive solution.

Thank you for a good product.

Tue, 04/06/2010 - 15:33

teson

Joined: 06/04/2010

Posts: 3

Re: Writing Multiple Elements in a Single Style in fckconfig

as it seems, being able to add initial text as an attribute would solve the trick;
as:

   'Info-box'   : { Element : 'div', Attributes : { 'class' : 'infobox', 'Initial' : '<h4>header</h4><p>text</p>'} },

possible??

Tue, 04/06/2010 - 15:45

takis

Joined: 29/11/2008

Posts: 12

Re: Writing Multiple Elements in a Single Style in fckconfig

Well, as far as I know - and the demos can prove this - the create-div-button creates a div that wraps around a given HTML fragment inside the editor. So, what seems to be the problem? You just write down what you want, then select it with your mouse and hit the create div button. Then the div that is created will wrap around the selected HTML! And you can control the div's styling by normal styles or classes or whatever as usual...

Tue, 04/06/2010 - 18:44

teson

Joined: 06/04/2010

Posts: 3

Re: Writing Multiple Elements in a Single Style in fckconfig

Thanks for your reply,

Yes, the create div-button works, but as it's used for a multiuser doc-site,
I'd rather avoid typing classes into the textbox.

What's the proper way of populating the combobox in the "createDiv"-popup-window?

I've browsed the FCKconfig-doc's but no luck yet.

Tue, 04/06/2010 - 19:32

takis

Joined: 29/11/2008

Posts: 12

Re: Writing Multiple Elements in a Single Style in fckconfig

Maybe it is here: http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.stylesSet...

Also it is useful to read this too: http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Styles...

Wed, 05/12/2010 - 16:26

emailbansal

Joined: 12/05/2010

Posts: 2

Re: Writing Multiple Elements in a Single Style in fckconfig

I went thru this post with suggested tactics but didnt work for me.

How can I add Styles to the dropdown box in Create Div container box?