Benutzer-Werkzeuge

Webseiten-Werkzeuge


software:typo3:templates

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen gezeigt.

Link zu dieser Vergleichsansicht

Both sides previous revision Vorhergehende Überarbeitung
Nächste Überarbeitung
Vorhergehende Überarbeitung
Letzte Überarbeitung Both sides next revision
software:typo3:templates [2012/10/08 09:28]
khopf [Beispiel TypoScript-Layout-Setup]
software:typo3:templates [2012/11/10 14:53]
khopf [Beispiel TypoScript-Layout-Setup]
Zeile 1: Zeile 1:
-====== Einbinden von Templates ​in Typo3 ======+====== ​Typo3: ​Einbinden von Templates ====== 
 +//<- Zurück zu [[software:​typo3]]//​ 
 + 
 +Typo3 ist ein sehr mächtiges CMS-System, das für sehr unterschiedliche Einsatzbereiche verwendbar ist, weshalb die Konfiguration manchmal recht kompliziert werden kann. Folgende Schritte sind für das Installieren eines Templates notwendig:
   - (X)HTML / CSS Template mit Dummytexten erstellen mit Beachtung von Suchmaschinenfreundlichkeit und Barrierefreiheit   - (X)HTML / CSS Template mit Dummytexten erstellen mit Beachtung von Suchmaschinenfreundlichkeit und Barrierefreiheit
   - HTML-Layout mit Layoutmarkern versehen   - HTML-Layout mit Layoutmarkern versehen
Zeile 30: Zeile 33:
   * Die Marker können entweder direkt im Dokument stehen oder in einer Kommentarumgebung,​ was außen herum im Kommentar steht ist nicht relevant. So ist ''<​!-- ###​MARKER###​ -->''​ gleichbedeutend mit ''<​!-- Toller ###​MARKER###​ beginnt -->''​   * Die Marker können entweder direkt im Dokument stehen oder in einer Kommentarumgebung,​ was außen herum im Kommentar steht ist nicht relevant. So ist ''<​!-- ###​MARKER###​ -->''​ gleichbedeutend mit ''<​!-- Toller ###​MARKER###​ beginnt -->''​
 ===== Beispiel TypoScript-Layout-Setup ===== ===== Beispiel TypoScript-Layout-Setup =====
 +Generelle Einstellungen: ​
 +
 <code typoscript>​ <code typoscript>​
  
 +# general configuration
 +#######################​
 +config {
 +  # Ausgabe von XHTML aktivieren
 +  xhtml_cleaning = all
 + 
 +  # set doctype to XHTML 1.0 strict
 +  doctype = xhtml_strict
 + 
 +  # set site language
 +  language = de
 + 
 +  # enable admin panel
 +  admPanel = 1
 + 
 +  # Spam Protection
 +  spamProtectEmailAddresses = 2
 +  spamProtectEmailAddresses_atSubst = (at)
 + 
 +  index_enable = 1
 +}
 + 
 +# format popup for pictures
 +tt_content.textpic.20{
 +  1.imageLinkWrap = 1
 +  1.imageLinkWrap {
 +    enable = 1
 +    bodyTag = <BODY bgColor=white leftmargin="​0"​ topmargin="​0"​ marginwidth="​0"​ marginheight="​0">​
 +    wrap = <A href="​javascript:​close();">​ | </A>
 +    JSwindow = 1
 +    JSwindow.newWindow = 1
 +    JSwindow.expand = 0,0
 +  }
 +}
 + 
 +tt_content.image.20 {
 +  1.imageLinkWrap = 1
 +  1.imageLinkWrap {
 +    enable = 1
 +    bodyTag = <BODY bgColor=white leftmargin="​0"​ topmargin="​0"​ marginwidth="​0"​ marginheight="​0">​
 +    wrap = <A href="​javascript:​close();">​ | </A>
 +    JSwindow = 1
 +    JSwindow.newWindow = 1
 +    JSwindow.expand = 0,0
 +  }
 +}
 +</​code>​
 +
 +Das eigentliche Template:
 +
 +<code typoscript>​
 # create PAGE-Objekt # create PAGE-Objekt
 ####################​ ####################​
 page = PAGE page = PAGE
 +
  
 #CSS einbinden #CSS einbinden
Zeile 41: Zeile 98:
    file2 = fileadmin/​templates/​[name]/​stylefile2.css    file2 = fileadmin/​templates/​[name]/​stylefile2.css
 } }
- 
-#Icon einbinden 
-page.headerData.1 = TEXT 
-page.headerData.1.value = <link rel="​shortcut icon" type="​image/​x-icon"​ href="​favicon.ico"​ /> 
-page.headerData.2 = TEXT 
-page.headerData.2.value = <link rel="​icon"​ type="​image/​x-icon"​ href="​favicon.ico"​ /> 
  
 #Meta-Tags einbinden #Meta-Tags einbinden
Zeile 58: Zeile 109:
  
 #create unordered list menu #create unordered list menu
-temp.TopMenu = HMENU 
-temp.TopMenu { 
-  entryLevel = 0 
-  # erstes level 
-  1 = TMENU 
-  1.wrap = <​ul>​|</​ul>​ 
-  1{ 
-    # no state: normale Formatierung 
-    NO{ 
-      wrapItemAndSub = <li> | </li> 
-    } 
-    # act state: gültig von der rootseite bis zur aktuellen Seite 
-    ACT = 1 
-    ACT { 
-      wrapItemAndSub = <li class="​act">​ | </li> 
-    } 
-    # cur state: gültig für die aktuelle Seite  
-    CUR=1  
-    CUR{ 
-      wrapItemAndSub = <li class="​act">​ | </li> 
-    } 
-  } 
-}    
   ​   ​
 temp.LeftMenu = HMENU temp.LeftMenu = HMENU
 temp.LeftMenu { temp.LeftMenu {
-  ​entryLevel = 1 +  # first level
-  ​zweites ​level+
   1 = TMENU   1 = TMENU
   1.wrap = <​ul>​|</​ul>​   1.wrap = <​ul>​|</​ul>​
Zeile 100: Zeile 127:
   }      }   
  
-  # drittes ​level +  # second ​level
-  ​+
   2 = TMENU   2 = TMENU
   2.wrap = <​ul>​|</​ul>​   2.wrap = <​ul>​|</​ul>​
Zeile 143: Zeile 169:
    ​subparts.CONTENT < styles.content.get    ​subparts.CONTENT < styles.content.get
    ​subparts.MENUE1 < temp.TopMenu    ​subparts.MENUE1 < temp.TopMenu
-   ​subparts.MENUE2 < temp.LeftMenu 
    ​subparts.COPYRIGHT < temp.copyright    ​subparts.COPYRIGHT < temp.copyright
 } }
 </​code>​ </​code>​
 +
 +===== Erweiterungen für Basis-TypoScript =====
 +  * [[software:​typo3:​favicon]]
 +  * [[software:​typo3:​menue]]
 +  * [[software:​typo3:​tt_news]]
 +
 +
 +{{tag>​typo3 template}}

Bei Verwendung dieses Wikis erklären Sie sich mit dem Haftungsausschluss, Nutzungsbedingungen und der Datenschutzerklärung dieses Wikis einverstanden. Impressum.

software/typo3/templates.txt · Zuletzt geändert: 2013/01/06 00:03 von khopf