SUMMARY OF: How could total separation of content (xhtml/xml) and presentation (CSS) be achieved with the Bitflux Editor (or Mozile)?

Simon Rönnqvist <[email protected]> Mon, 14 Mar 2005 22:49:34 +0200
Newsgroups gmane.editors.bitflux.general
Message-ID <[email protected]>
On Mar 4, 2005, at 05:05, Christian Stocker wrote:

>
> Hi Simon
>
>
> I'm on vacation until next monday in a week. I'm happy to answer your
> questions thoroughly but you have to wait until then ;)
>
> chregu

   Hi!

Welcome back from your vacation, beautiful pictures you took over there 
'down under'!

I added some comments and thoughts that has come up in the discussions 
and otherwise in my research since I posted the original mail.
To save your time I also added the answers for the questions which I 
found answers for.

I look forward to hearing your comments and suggestions. And just ask 
if something needs to be clarified.

   cheers, Simon


> On Fri, 4 Mar 2005, Simon Rönnqvist wrote:
>
>>    Hi!
>>
>> * * * BACKGROUND * * *
>> For my thesis work I'm looking for a CMS along with a WYSIWYG that
>> would support separation of content from presentation (CSS) to the 
>> best
>> possible degree. BxCMS and Lenya are my candidates for the CMS but at
>> least the Bitflux Editor seems to be a clear winner when it comes to
>> the WYSIWYG-editor. (Or would even Mozile be good for the job?)
>> Therefore I'd like to evaluate the Bitflux Editor's (and possibly
>> Mozile's) abilities for separation of content and presentation. If
>> you'd be very interested in this evaluation I could consider writing
>> the thesis in English, otherwise I might stick to my mother's thounge
>> Swedish. :-) Do you have any comments or thoughts about these things?
>>
>> * * * TO THE POINT * * *
>> One thing which I at this point think seems to be missing from the
>> Bitflux Editor (and Mozile) is an ability to edit external
>> CSS-properties. :-) It'd be great if one for example could give an
>> image a specific ID and then in the separate CSS float that element
>> right or left.

   ...or specify based on context (and including classes/ID:s) which 
elements should be floated.
I.e. one could in a pop-up menu select float peer elements right. Which 
could produce something like "div#main img { float: right; }".

It seems like RelaxNGEnhancement (OnNew Callback&Add Menu entry) in BXE 
2.0 could be of use.
http://wiki.bitfluxeditor.org/BXE_2.0/RelaxNGEnhancement
Either one could make a function producing the CSS or one could have a 
popup URL connect to a serverside script producing the CSS.

It'd be nice if one could have the changes in the CSS updated instantly 
in the editor without saving it onto the server. So I guess that the 
function would be a better solution, but then we'd need to be able to 
have BXE submit CSS and XHTML separately to the CMS.

Another solution would be to have BXE use inline CSS and then have a 
serverside CSS-separator, but this wouldn't allow the system to produce 
a CSS-selector like "div#main img". (An advantage of this method though 
would be that I'd work with other editors than BXE too.)

>> To my present understanding (correct me if I'm wrong)
>> I'd have to specify a class i.e. called "left" or "right", which
>> semantically wouldn't make any sense. Then I might just as well 
>> specify
>> a style="float: ..." attribute instead, and then the separation of
>> content and style would have failed at that point. (One could of 
>> course
>> argue wether there's a need for total separation or not, but let's say
>> there is. This img floating is just an example.)

   So in this example I wouldn't like to use inline styles, but that 
wouldn't be any worse than assigning styles called "left" or "right". 
What I'd like to have would be good semantics and total separation of 
content and style.

The CSS produced could look like:
#picture1, #picture3 { float: right; }
#picture2, #picture4 { float: left; }
#picture4 { border: 1px solid red;
                     margin-left: 5px; } /* Maybe one could also allow 
the user to assign an own combination of properties to an element or 
predefined set of properties (like when applying CSS-classes). */
#picture3 { border: '$width'px solid black; }  /* Would it also be 
useful to make some variables in the CSS definable by the user? */

We should also think of what kind of functionality could be useful. 
I've personally been thinking of many different kinds of functionality 
but what I think seems most sensible would be to let the designer 
define what selectors could be used by using the "Add Menu entry" 
functionality. So each allowed selector concerning an element would 
have it's own menu entry. One would also have to define some kind of 
variable for ID and class, since they should be able to be defined by 
the user.

Anyway for some more ideas on different kinds of management system 
functionality for CSS look here:
http://digital-web.com/articles/integrating_css_with_cms/


The rest of this mail is not really so interesting anymore:

>> Basically what I'd be looking for is an ability to assign ID:s and
>> classes to elements and then to make certain predefined css-properties
>> apply to the ID:s or classes of choise. One could build a separate
>> CSS-editor which could be used with any WYSIWYG xhtml/xml editor that
>> would allow the user to define class and id attributes for the
>> elements. But a better idea would be to integrate the CSS-editor with
>> the WYSIWYG so that all style related data (CSS) would automatically 
>> be
>> separated from the markup (html/xml) without the user even having to
>> know about it.
>>
>> More on this here:
>> http://digital-web.com/articles/integrating_css_with_cms/comments/
>> #comment835
>>
>> So to begin with I guess being able to assign class and ID attributes
>> to different elements would get me quite far. To my understanding this
>> is at least possible in Bitflux Editor 2.0, isn't it? How about 
>> Bitflux
>> Editor 1.0 or even Mozile? (I'd prefer being able to specify 
>> attributes
>> directly to elements such as img-tags, extra span and div-tags would 
>> do
>> the job but in a rather ugly way.)

   The answer for this is that you can assign ID:s in both BXE 1 and 2 
but not in Mozile.
Sorry for asking, but I just kind of missed that functionality in the 
beginning... :-)

>> Do btw. all or any of these editors have a possibility to give the 
>> user
>> a set of choises of classes (or other attributes)?
>> I.e. <div class="floatLeft">, <div class="floatRight"> and so on... 
>> and
>> not just tags without attributes.

   The answer is yes for all of them.
But this functinality isn't of much use

>>    regards, Simon
>>

-- 
bx-editor-users mailing list
[email protected]
http://lists.bitflux.ch/cgi-bin/listinfo/bx-editor-users