[Typo3-UG Dutch] Intro in templates en typoscript
Patrick Broens
patrick at patrickbroens.nl
Wed Sep 28 21:13:07 CEST 2005
Hi Dennisjan,
Er zijn twee mogelijkheden om templates te bouwen in TYPO3, nl door
middel van HTML templates en deze te integreren, met o.a. het voorbeeld
van Sacha Ligthert, en de tweede is door daadwerkelijk de hele template
op te bouwen middels TypoScript. Als je weinig ervaring hebt met
TypoScript, kan ik deze methode, zeker in het begin, afraden.
Je vraag is echter wel hoe je templates bouwt met TypoScript. Is de
toelichting van Sacha voldoende, of bedoel je toch echt de template
helemaal in TypoScript opbouwen.
Patrick Broens
Sacha Ligthert wrote:
> On Wed, September 28, 2005 14:52, DJ Broerse said:
>
>>Hallo Typo3ers,
>>
>>Wie is er bereid om in een verloren uurtje een keer mij een introductie
>>te geven hoe ik in Typo3 templates bouwmet typoscript?
>
>
> Het volgende is een "crash course" wat ik geschreven voor een
> opdrachtnemer voor de conversie van een template naar hapbare broken voor
> typo3.
>
> Voor het maken van content raad ik aan om de videos te bekijken.
>
> #### BEGIN ####
> Installeer met de Ext Manager van de online repository de volgende
> extentions:
> - css_styled_content
> - automaketemplate
>
> Upload de template in de map
> - fileadmin/
> Of maak een mapje genaamd "template" (wat redelijk standaard is lijkt mij)
> en pleur daar alles in.
>
> Maak een pagina aan.
> Klik op Template (in de menu links) en klik op die ene pagina.
> Maak dan een volledige template.
>
> Doe dit in setup
> --- BEGIN ---
> # Configuring the Auto-Parser for main template:
> plugin.tx_automaketemplate_pi1 {
> # Read the template file:
> content = FILE
> content.file = fileadmin/template.html
>
> # Here we define which elements in the HTML that
> # should be wrapped in subpart-comments:
> elements {
> BODY.all = 1
> BODY.all.subpartMarker = DOCUMENT_BODY
>
> HEAD.all = 1
> HEAD.all.subpartMarker = DOCUMENT_HEADER
> HEAD.rmTagSections = title
>
> TD.all = 1
> DIV.all = 1
> }
>
> # Prefix all relative paths with this value:
> relPathPrefix = fileadmin/
> }
>
> # Menu 1 cObject
> temp.menu = HMENU
> # First level menu-object, textual
> temp.menu.1 = TMENU
> temp.menu.1 {
> # Normal state properties
> NO.allWrap = <div class="menu1-level1-no"> | </div>
> # Enable active state and set properties:
> ACT = 1
> ACT.allWrap = <div class="menu1-level1-act"> | </div>
> }
> # Second level menu-object, textual
> temp.menu.2 = TMENU
> temp.menu.2 {
> # Normal state properties
> NO.allWrap = <div class="menu1-level2-no"> | </div>
> # Enable active state and set properties:
> ACT = 1
> ACT.allWrap = <div class="menu1-level2-act"> | </div>
> }
> # Third level menu-object, textual
> temp.menu.3 = TMENU
> temp.menu.3 {
> # Normal state properties
> NO.allWrap = <div class="menu1-level3-no"> | </div>
> # Enable active state and set properties:
> ACT = 1
> ACT.allWrap = <div class="menu1-level3-act"> | </div>
> }
>
> # Main TEMPLATE cObject for the BODY
> temp.mainTemplate = TEMPLATE
> temp.mainTemplate {
> # Feeding the content from the Auto-parser to the TEMPLATE cObject:
> template =< plugin.tx_automaketemplate_pi1
> # Select only the content between the <body>-tags
> workOnSubpart = DOCUMENT_BODY
>
> # Substitute the ###content### subpart with some example content:
>
> subparts.content < styles.content.get
>
> # Substitute the ###menu_1### subpart with dynamic menu:
> subparts.menu < temp.menu
>
> }
>
> # Main TEMPLATE cObject for the HEAD
> temp.headTemplate = TEMPLATE
> temp.headTemplate {
> # Feeding the content from the Auto-parser to the TEMPLATE cObject:
> template =< plugin.tx_automaketemplate_pi1
> # Select only the content between the <head>-tags
> workOnSubpart = DOCUMENT_HEADER
> }
>
> # Default PAGE object:
> page = PAGE
> page.typeNum = 0
>
> # Copying the content from TEMPLATE for <body>-section:
> page.10 < temp.mainTemplate
>
> # Copying the content from TEMPLATE for <head>-section:
> page.headerData.10 < temp.headTemplate
>
> # Deze regel is negeerbaar, laat de AdminPanel niet zien aan de voorkant
> als je achter bent ingelogd.
> config.admPanel = 0
> --- EINDE ---
>
> Er zijn een paar dingen waar je hierop moet letten.
> De regel: content.file = fileadmin/template.html
> Dit is het pad van je template file.
>
> Er is een serie van de volgende regels:
> NO.allWrap = <div class="menu1-level1-no"> | </div>
>
> de classen hebben een opbouw..
> level 1 is de menu zoals je ze ziet.
> level 2 is de menu daaronder.
> level 3 is de menu daaronder.
>
> In de CSS moet je hier rekening mee houden.
> Zie ook http://www.ligthert.net/
>
> de -no of -act aan het einde geeft aan dat de menu item actief is of niet.
> Dit lijkt me verder vanzelf sprekend.
>
> De HTML template is verder vrij simpel:
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
> <head>
> <title>Homepage: Sacha Ligthert</title>
> <link rel="StyleSheet" href="site.css" type="text/css" />
> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
> </head>
> <body>
> <div id="menu"> </div>
> <div id="content"> </div>
> </body>
> </html>
>
> (CSS voor deze HTML dien je te zoeken op m'n site of zelf te maken ;-))
>
> Het gaat om de volgende twee regels.
> <div id="menu"> </div>
> <div id="content"> </div>
>
> De id geeft aan waar typo3 de menu of content moet plaatsen.
> plaats dit dus.
>
> Tenzij je een config meegeeft is de HTML die typo3 uitspuuwd html401 ipv
> xhtml.
>
> #### EINDE ####
>
> Het is wat grof, maar in grote lijnen klopt het wel.
>
>
>>Dus, wie vind het leuk om mij daar eens door heen te lopen? Locatie
>>maakt mij niet uit, eventueel kan het ook via skype.
>
>
> Dit converteren naar een beknoptere handleiding niet conform typo3.org
> standaarden zou wel goed zijn (geld ook voor vertalingen). Ik denk dat
> Typo3 templating het grootste ramp in Typo3 is en een korte toelichting
> zoals deze geen kwaad kan eigenlijk ;-)
>
> Groet,
>
> Sacha
>
More information about the TYPO3-UG-dutch
mailing list