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

[Tyler Kraft]

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
>>>
>