[TYPO3-english] Content-position specific styling in htmlArea

[Erich Schreiber]

Hi Tyler,

This was a very clear answer. I've seen a similar reply recently in
the typo3.projects.rte group in respect to per-column htmlArea
configuration and I couldn't believe it. 

Anyway, thank you for pointing this out again!

Erich

On Wed, 10 Jun 2009 13:01:31 +0100, Tyler Kraft
<tyler.kraft at netefficiency.co.uk> wrote:

>Hi
>
>You can't do this afaik - and I say this having lots of use over the 
>years of creating my own very very bespoke htmlarea setups for all 
>manner of things, and my own very strange layouts for template. There is 
>no way that I'm aware of for being able to set htmlarea to behave or use 
>a different css file in the BE depending upon the column the editor is 
>editing in, or the content type that is being edited.
>
>Sorry to disappoint.
>
>
>Erich Schreiber wrote:
>> Hi Loek,
>> 
>> Thank you for taking the time to answer my question.
>> 
>> But either I didn't make clear what we intended or I do not understand
>> your answer. 
>> 
>> What we need is the following: no change to the frontend-mark-up or
>> frontend CSS. This is already perfect. We want to see the correct
>> layout inside htmlArea corresponding to the current layout of the
>> element in the frontend. The text in the editor should look as similar
>> to the frontend styling as possible. 
>> 
>> We code with respect to the 'structural semantic mark-up paradigm'.
>> That means 'structural semantics' belong to HTML and layout to CSS. We
>> try to use no classes where they are not really necessary.
>> 
>> Let's say a <h1> is green in one part of the page and red in another
>> one. There's no extra class attribute to make this happen, but this is
>> the mechanics of the CSS cascade. But how can we achieve this in the
>> htmlArea which only opens an element and does know nothing about it's
>> location in the CSS cascade?
>> 
>> Erich
>> 
>> 
>> On Mon, 08 Jun 2009 12:38:30 +0200, Loek Hilgersom
>> <hilgersom at xs4all.nl> wrote:
>> 
>>> Hi Erich,
>>>
>>> Maybe you could use a field from the content records, e.g. section_frame, to 
>>> select which id to wrap around that content element (or better, use a class 
>>> instead of id so you can use the same styling more than once on a page if wanted).
>>>
>>> Put this in Page TS on your root page:
>>>
>>> TCEFORM.tt_content {
>>> 	section_frame {
>>> 		removeItems = 1,5,6,7,10,11,12,13,20,21
>>> 		addItems.30 = Layout 0
>>> 		addItems.31 = Layout 1
>>> 		addItems.32 = Layout 2
>>> 	}
>>> }
>>>
>>> then in your TS setup:
>>>
>>> contentdiv.cObject = CASE
>>> contentdiv.cObject {
>>> 	key.field = section_frame
>>> 	default < tt_content.stdWrap.wrap
>>>
>>> 	default = TEXT
>>> 	default.value = |
>>>
>>> 	30 < tt_content.stdWrap.wrap
>>> 	30 = TEXT
>>> 	30.value = <div class="layout0">|</div>
>>>
>>> 	31 < tt_content.stdWrap.wrap
>>> 	31 = TEXT
>>> 	31.value = <div class="layout1">|</div>
>>>
>>> 	32 < tt_content.stdWrap.wrap
>>> 	32 = TEXT
>>> 	32.value = <div class="layout2">|</div>
>>> }
>>> tt_content.stdWrap.outerWrap < contentdiv
>>>
>>> hth,
>>> Loek
>>>
>>>
>>>
>>> Erich Schreiber wrote:
>>>> Hi,
>>>>
>>>> We normally use <div id="something"> ... </div> to setup different
>>>> areas in our sites (like 'main_content', 'menu', 'footer', etc.).
>>>> Inside of those DIVs standard HTML-tags do not use further classes and
>>>> are configured with CSS rules like '#something strong { ... };'
>>>>
>>>> E.g. We have a text-element 'Hello' and put it into header, main
>>>> content and footer. In the frontend it will look different because of
>>>> the different CSS rules for those locations. Just now our htmlArea
>>>> configuration looks the same for all those cases.
>>>>
>>>> How do we get htmlArea to display those different styles in dependence
>>>> of frontend-location?
>>>>
>>>> This should work in standard subpart-composition and in Templa Voilá
>>>> with sub-templates.
>>>>
>>>> Erich
>>>>
>>