[TYPO3-templavoila] Good practices: variants of the same HTML layout, what's your opinion?

Marcus 'biesior' Biesioroff vsbies at wp.pl
Sat Apr 3 11:43:54 CEST 2010


ellou' Ron and Ricardo!

Thank you for your replies, also please forgive me long silence, that 
was busy time for me, and I couldn't take care about my own problem :)

Ron, yes I can see my post isn't clear enought (I wrote that before) :) 
what's more I didn't wrote everything I should. Now I realized finally 
what I want to get.

GOALS:
There are two goals to fetch, first is simplifying layout selecting for 
commen BE-editor. Just create new page, choose the icon with the TV 
template object (TO) and insert Content Elements (CE)

Second goal is make it easier for webmaster/developer to modify the 
whole branch of layouts, by modifying single HTML file and single TV DS
(hih, now I hope I'm clear enough ;) )




MY SOLUTION:
I spent some time yesterday on this and finally found acceptable (IMO) 
solution. In general I mapped the container which should has "dynamic" 
class using OUTER mapping style and "recreated" the container using wrap 
in DS' TypoScript section:

First I created placeholder to replace in HTML template:

<div id="cameleo">
   Some text in div#cameleo, will be replaced by TV.
</div>

Full HTML sample
[1]http://biesior.pastebin.com/4RkmH93s



I mapped the Element into the div#cameleo using OUTER style (to remove 
the div from output) and "recreated" the container using wrap property 
with the same ID and required class name:

<TypoScript><![CDATA[
10= RECORDS
10.wrap = <div id="cameleo" class="somedefaultclass" >|</div>
10.source.current=1
10.tables = tt_content
]]></TypoScript>

Full DS code:
[2]http://biesior.pastebin.com/v2v9V0xQ



Finally I created additional two TV TemplateObjects (TO) using the same 
DS and HTML template file and used Local Processing (XML) field to 
overwrite the wrap:

<TypoScript><![CDATA[
10= RECORDS
10.wrap = <div id="cameleo" class="greenback">|</div>
10.source.current=1
10.tables = tt_content
]]></TypoScript>

and

<TypoScript><![CDATA[
10= RECORDS
10.wrap = <div id="cameleo" class="redback">|</div>
10.source.current=1
10.tables = tt_content
]]></TypoScript>

Full sample of the Local Processing (overwritten value marked with 
yellow background):
[3]http://biesior.pastebin.com/Dhj45j1q



CONCLUSION:
That's all the magic :) The best in this idea is, that's possible to 
change many containers behaviour/class, whatever in each TO...

The only thing that would be usefull is new theoretical button in TV 
"Update selected templates at once" as change in the HTML causes need to 
update many TO's in TV module... but that's quite other story :)



Thanks for replies, with best greetings, Marcus








2010-03-29 00:30, Ron Hall:
> Hello Marcus
>
> If I understand you correctly, you could do this.
>
> First, write your entire header as one TypoScript object and map that to your templates with outer mapping.
>
> Next write your header like this
>
> lib.header = COA
> lib.heade.wrap =<div class="{$myHeaderClass}">|</div>
>
> You can then set your header class in section with the constant:  myHeaderClass

2010-04-02 12:05, Riccardo De Contardi:
> <div class="myHeaderClass">
>     ...all your stuff...
> </div>
>
> Then, map here an ATTRIBUTE element in TV, choosing "class" as attribute and type="select" (or selector box, I don't remember exactly the name).
> Last, edit your DS and add the values you need:




-- 
Marcus 'biesior' Biesioroff
a.k.a. Marek Krawczyk (original)

Polish TYPO3 Community
http://typo3.pl


More information about the TYPO3-project-templavoila mailing list