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
software:typo3:templates [2012/10/08 09:15]
khopf [(X)HTML-Seite mit Content-Markern]
software:typo3:templates [2013/01/06 00:03] (aktuell)
khopf [Beispiel TypoScript-Layout-Setup] Inkonsistenz
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 # general configuration
 #######################​ #######################​
 config { config {
-  # Ausgabe von XHTML aktivieren  +  # Ausgabe von XHTML aktivieren 
-  xhtml_cleaning = all  +  xhtml_cleaning = all 
- +  
-  # set doctype to XHTML 1.0 strict ​ +  # set doctype to XHTML 1.0 strict
-  #doctype = xhtml_trans+
   doctype = xhtml_strict   doctype = xhtml_strict
-  #​renderCharset = utf-8 + 
   # set site language   # set site language
-  htmlTag_langKey = de 
   language = de   language = de
-  locale_all = german + 
-  sys_language_uid = 0 +
- +
-  # suppress XML Prolog for IE-kompatibility +
-  xmlprologue = none +
   # enable admin panel   # enable admin panel
   admPanel = 1   admPanel = 1
- + 
-  # externalize CSS and JS +
-  removeDefaultJS = 0 +
   # Spam Protection   # Spam Protection
   spamProtectEmailAddresses = 2   spamProtectEmailAddresses = 2
   spamProtectEmailAddresses_atSubst = (at)   spamProtectEmailAddresses_atSubst = (at)
 + 
   index_enable = 1   index_enable = 1
 } }
 + 
 # format popup for pictures # format popup for pictures
-tt_content.textpic.20{  +tt_content.textpic.20{ 
-  1.imageLinkWrap = 1  +  1.imageLinkWrap = 1 
-  1.imageLinkWrap {  +  1.imageLinkWrap { 
-    enable = 1  +    enable = 1 
-    bodyTag = <BODY bgColor=white leftmargin="​0"​ topmargin="​0"​ marginwidth="​0"​ marginheight="​0">​  +    bodyTag = <BODY bgColor=white leftmargin="​0"​ topmargin="​0"​ marginwidth="​0"​ marginheight="​0">​ 
-    wrap = <A href="​javascript:​close();">​ | </A>  +    wrap = <A href="​javascript:​close();">​ | </​A>​ 
-    JSwindow = 1  +    JSwindow = 1 
-    JSwindow.newWindow = 1  +    JSwindow.newWindow = 1 
-    JSwindow.expand = 0,0  +    JSwindow.expand = 0,0 
-  } +  }
 } }
- +  
-tt_content.image.20 {  +tt_content.image.20 { 
-  1.imageLinkWrap = 1  +  1.imageLinkWrap = 1 
-  1.imageLinkWrap {  +  1.imageLinkWrap { 
-    enable = 1  +    enable = 1 
-    bodyTag = <BODY bgColor=white leftmargin="​0"​ topmargin="​0"​ marginwidth="​0"​ marginheight="​0">​  +    bodyTag = <BODY bgColor=white leftmargin="​0"​ topmargin="​0"​ marginwidth="​0"​ marginheight="​0">​ 
-    wrap = <A href="​javascript:​close();">​ | </A>  +    wrap = <A href="​javascript:​close();">​ | </​A>​ 
-    JSwindow = 1  +    JSwindow = 1 
-    JSwindow.newWindow = 1  +    JSwindow.newWindow = 1 
-    JSwindow.expand = 0,0  +    JSwindow.expand = 0,0 
-  } +  }
 } }
 +</​code>​
  
 +Das eigentliche Template:
 +
 +<code typoscript>​
 # create PAGE-Objekt # create PAGE-Objekt
 ####################​ ####################​
 page = PAGE page = PAGE
 +
  
 #CSS einbinden #CSS einbinden
 page.includeCSS { page.includeCSS {
    file1 = fileadmin/​templates/​[name]/​stylefile1.css    file1 = fileadmin/​templates/​[name]/​stylefile1.css
-   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 115: Zeile 109:
  
 #create unordered list menu #create unordered list menu
 +  ​
 temp.TopMenu = HMENU temp.TopMenu = HMENU
 temp.TopMenu { temp.TopMenu {
-  ​entryLevel = 0 +  # first level
-  ​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 { +
-  entryLevel = 1 +
-  # zweites ​level+
   1 = TMENU   1 = TMENU
   1.wrap = <​ul>​|</​ul>​   1.wrap = <​ul>​|</​ul>​
Zeile 157: Zeile 127:
   }      }   
  
-  # drittes ​level +  # second ​level
-  ​+
   2 = TMENU   2 = TMENU
   2.wrap = <​ul>​|</​ul>​   2.wrap = <​ul>​|</​ul>​
Zeile 185: Zeile 154:
   data = date : U   data = date : U
   strftime = %Y   strftime = %Y
-  wrap = &​copy;&​nbsp;​|&​nbsp;​Fischer Automation GmbH &​middot;​+  wrap = &​copy;&​nbsp;​|&​nbsp; ​Seitenname ​&​middot;​
 } }
  
Zeile 195: Zeile 164:
 page.1 { page.1 {
    ​template = FILE    ​template = FILE
-   ​template.file = fileadmin/​templates/​mj/index.html+   ​template.file = fileadmin/​templates/​[name]/index.html
    ​workOnSubpart = BODY    ​workOnSubpart = BODY
    ​subparts.SITETITLE < temp.seitentitle    ​subparts.SITETITLE < temp.seitentitle
    ​subparts.CONTENT < styles.content.get    ​subparts.CONTENT < styles.content.get
    ​subparts.MENUE1 < temp.TopMenu    ​subparts.MENUE1 < temp.TopMenu
-   ​subparts.MENUE2 < temp.LeftMenu 
-   #​subparts.ROOTLINE < tmp.breadcrump 
    ​subparts.COPYRIGHT < temp.copyright    ​subparts.COPYRIGHT < temp.copyright
 } }
 +</​code>​
  
-# define different layout for dropdown menu +===== Erweiterungen für Basis-TypoScript ===== 
-[globalVar=TSFE:page|layout=1+  ​* ​[[software:typo3:​favicon]
-  ​page.1.template.file= ​[layout-file+  ​[[software:​typo3:​menue]
-[global]+  ​* ​[[software:​typo3:​tt_news]]
  
-# realurl with simulatestatic 
-config { 
-  simulateStaticDocuments = 1 
-  simulateStaticDocuments_addTitle = 1 
-} 
  
-#Plugin: tt_news +{{tag>typo3 template}}
-plugin.tt_news.latestLimit = 2 +
-plugin.tt_news.displayList ​{ +
-  date_stdWrap.strftime = %A, den %d %B %Y +
-  time_stdWrap.strftime = %d.%m.%Y %H.%M +
-  subheader_stdWrap ​  +
-     ​append = TEXT   +
-     ​append.data = register:​newsMoreLink ​  +
-     ​append.wrap = <span class="​bodytext"​>|</​span>​ +
-  ​} +
-} +
-plugin.tt_news.pageBrowser { +
-  showResultCount = 0 +
-  dontLinkActivePage = 1 +
-+
- +
-plugin.tt_news.displayLatest { +
-  subheader_stdWrap{ +
-    append = TEXT   +
-    append.data = register:​newsMoreLink ​  +
-    append.wrap = <span class="​bodytext">​ |</​span>​ +
-  } +
-+
-plugin.tt_news.displayLatest.subheader_stdWrap.wrap = <​h3>​|</​h3>​ +
-plugin.tt_news.displaySingle.subheader_stdWrap.wrap = <​h3>​|</​h3>​ +
-</​code>​+

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

software/typo3/templates.1349680539.txt.gz · Zuletzt geändert: 2012/10/11 10:23 (Externe Bearbeitung)