Typo3 - TS Templates: Unterschied zwischen den Versionen

Aus Wikizone
Wechseln zu: Navigation, Suche
 
(12 dazwischenliegende Versionen von 6 Benutzern werden nicht angezeigt)
Zeile 2: Zeile 2:
 
Es gibt einige Grundsätzliche Einstellungen die immer wieder gemacht werden müssen. Hier finden sich einige davon. Einige weiterführende Einstellungen finden sich in [[Typo3 - Tipps und Tricks]]
 
Es gibt einige Grundsätzliche Einstellungen die immer wieder gemacht werden müssen. Hier finden sich einige davon. Einige weiterführende Einstellungen finden sich in [[Typo3 - Tipps und Tricks]]
  
 +
=== XHTML ===
 +
# DOCTYPE auf XHTML Transitional umstellen
 +
config.doctype = xhtml_trans
 +
# XML-Prolog aus
 +
config.xmlprologue = none
 +
# Standard XHTML Filter aktivieren (Tags werden kleingeschrieben, ...)
 +
config.xhtml_cleaning = all
 +
# HTML Atribute setzen
 +
config.htmlTag_setParams = xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de"
  
 
== Spracheinstellungen ==
 
== Spracheinstellungen ==
  
 
== HTML-Template einbinden ==
 
== HTML-Template einbinden ==
 +
siehe auch: [[Typo3 - HTML-Templates]]
 
Beispiel (das page Objekt muß natürlich vorher definiert werden):
 
Beispiel (das page Objekt muß natürlich vorher definiert werden):
  
Zeile 73: Zeile 83:
 
== Inline CSS loswerden ==
 
== Inline CSS loswerden ==
 
Bei vielen Extensions und bei CSS Styled ImgText liegt das CSS Inline. Besser wäre ist es das CSS komplett in eigene Dateien auszulagern.
 
Bei vielen Extensions und bei CSS Styled ImgText liegt das CSS Inline. Besser wäre ist es das CSS komplett in eigene Dateien auszulagern.
 +
 +
== CSS per random laden ==
 +
 +
im typoscritp template:
 +
<pre>
 +
# Configuring the Auto-Parser for main template:
 +
 +
plugin.tx_automaketemplate_pi1 {
 +
    # Read the template file:
 +
  content = FILE
 +
  content.file = fileadmin/template/rasterpage-startseite-css.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/template/
 +
}
 +
</pre>
 +
 +
//----------------------------  random css  ---------------------------------
 +
 +
<pre>
 +
temp.cssrandom =  PHP_SCRIPT
 +
temp.cssrandom.file = fileadmin/template/random_css.php
 +
 +
 +
# 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
 +
 +
/*
 +
/ html templates need a marker named <!--###cssrandom### begin -->random css<!--###cssrandom### end --> in the head
 +
*/
 +
 +
  subparts.cssrandom < temp.cssrandom
 +
}
 +
</pre>
 +
 +
im html-template:
 +
 +
<pre>
 +
<html xmlns="http://www.w3.org/1999/xhtml">
 +
<head>
 +
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 +
<title>DER TITEL</title>
 +
 +
<!--###cssrandom### begin -->random css<!--###cssrandom### end -->
 +
 +
</head>
 +
</pre>
 +
 +
und das ist das random_css.php
 +
 +
<pre>
 +
<?php
 +
/***********************
 +
*  Copyright notice
 +
*  GPL
 +
*  @author fabian thommen job@fabtho.net
 +
*/
 +
 +
$relPathPrefix='fileadmin/template/';
 +
$css = array('eins.css','zwei.css','drei.css','vier.css');
 +
$randomzahl = rand(0, count($css)-1);
 +
$content = '<link href="'.$relPathPrefix.'css/'.$css[$randomzahl].'" rel="stylesheet" type="text/css" />';
 +
if (headers_sent()) {
 +
  exit;
 +
}
 +
?>
 +
</pre>
  
 
== JavaScript in externe Datei auslagern ==
 
== JavaScript in externe Datei auslagern ==
 
Z.B. der kleine JavaScript Schnipsel für das Blur im IE auslagern.
 
Z.B. der kleine JavaScript Schnipsel für das Blur im IE auslagern.
 
Wie bindet man externes JavaScript ein.
 
Wie bindet man externes JavaScript ein.
 +
 +
== Ausgabe einer Spalte Wrappen ==
 +
'''Beispiel:'''
 +
<pre>
 +
#Inhalt rechts
 +
subparts.CONTENT_RIGHT < styles.content.getRight
 +
#Ganze Spalte Wrappen
 +
subparts.CONTENT_RIGHT.wrap = <div class="content_right"> | </div>
 +
#Einzelnes Element Wrappen
 +
subparts.CONTENT_RIGHT.renderObj.stdWrap.wrap=<div class="bordered">|</div>
 +
</pre>
 +
=== Ausgabe einer Spalte Wrappen wenn nicht leer ===
 +
Hier wird das content element nur mit einem div gewrapt wenn es nicht leer ist
 +
<pre>
 +
temp.rightContent < styles.content.getRight
 +
temp.rightContent.stdWrap {
 +
  wrap = <div id="right-main"> | </div>
 +
  if.isTrue.numRows < styles.content.getRight
 +
}
 +
</pre>
 +
(TypoWizard.com 9.1.2006)
 +
 +
 +
=== Senkrechter Strich bei Wrap ===
 +
 +
 +
Um bei einem Wrap (zum Beispiel im Menü) zwischen jedem Eintrag einen senkrechten Strich | darzustellen, ist folgende Eingabe möglich:
 +
<pre>
 +
<nowiki>tt_content.menu.20.2.1.NO.linkWrap = | &#124;&nbsp;|*||*| |</nowiki>
 +
</pre>
 +
 +
== Benutzer Funktionen (userFunc) ==
 +
 +
Beispiele (Quelle: http://typo3.umloud.dk/index.php?id=359 22.5.2006)
 +
 +
<pre>
 +
 +
<?php
 +
 +
 +
 +
 +
class user_UserFunc{
 +
 +
 +
 +
 +
 +
    /*
 +
 +
    * Function: getRandomRecordIds()
 +
 +
    *
 +
 +
    * Returns a random comma seperated list of IDs
 +
 +
    *
 +
 +
    * Parameters:
 +
 +
    *
 +
 +
    *    table    -    The table to get the record IDs from
 +
 +
    *    pid - The Page ID of the page where the records are located
 +
 +
    *    max - The number of IDs to return
 +
 +
    *
 +
 +
    * Example:
 +
 +
    *
 +
 +
    *    includeLibs.functions = fileadmin/scripts/UserFunc.inc
 +
 +
    *   
 +
 +
    *    lib.randomRecords = COA_INT
 +
 +
    *    lib.randomRecords {
 +
 +
    *      10 = TEXT
 +
 +
    *      10.wrap = <div id="randomRecords">|</div>
 +
 +
    *      10.preUserFunc = user_UserFunc->getRandomRecordIds
 +
 +
    *      10.preUserFunc.pid = {$lib.randomRecords.pid}
 +
 +
    *      10.preUserFunc.table = {$lib.randomRecords.table}
 +
 +
    *      10.preUserFunc.max = {$lib.randomRecords.max}
 +
 +
    *      10.split.token = ,
 +
 +
    *      10.split.cObjNum = 1
 +
 +
    *      10.split.1 {
 +
 +
    *        10 = RECORDS
 +
 +
    *        10.dontCheckPid = 1
 +
 +
    *        10.tables = {$lib.randomRecords.table}
 +
 +
    *        10.source.current = 1
 +
 +
    *        10.conf.{$lib.randomRecords.table} = COA
 +
 +
    *        10.conf.{$lib.randomRecords.table} {
 +
 +
    *          10 = IMAGE
 +
 +
    *          10.file.import = uploads/tx_bannerimages/
 +
 +
    *          10.file.import.data = field:image
 +
 +
    *          10.file.import.listNum = 0
 +
 +
    *          10.stdWrap.typolink.parameter.data = field:url
 +
 +
    *          10.stdWrap.typolink.wrap = <span>|</span>
 +
 +
    *        }
 +
 +
    *      }
 +
 +
    *    }
 +
 +
    *
 +
 +
    */
 +
 +
    function getRandomRecordIds($content,$conf){
 +
 +
        $lCObj = t3lib_div::makeInstance("tslib_cObj");
 +
 +
 +
 +
        $table = $conf['table'];
 +
 +
        $pid = $conf['pid'];
 +
 +
        $max = $conf['max'];
 +
 +
 +
 +
        $query = 'SELECT * FROM '.$table.' WHERE pid='.$pid.$lCObj->enableFields($table).' ORDER BY RAND() LIMIT 0,'.$max;
 +
 +
        $res = mysql(TYPO3_db,$query);
 +
 +
 +
 +
        $ar = array();
 +
 +
        while($row = mysql_fetch_assoc($res)){
 +
 +
            $ar[] = $row['uid'];
 +
 +
        }
 +
 +
        return implode(",",$ar);
 +
 +
    }
 +
 +
 +
 +
 +
 +
    /*
 +
 +
    * Function: getCurrentFEuser()
 +
 +
    *
 +
 +
    * Return a field from fe_users table
 +
 +
    *
 +
 +
    * Parameters:
 +
 +
    *
 +
 +
    *    field    -    The feusers field to get.
 +
 +
    *
 +
 +
    *    The marker ###USER### is replaced with the returned value
 +
 +
    *
 +
 +
    * Example:
 +
 +
    *
 +
 +
    *    includeLibs.functions = fileadmin/scripts/UserFunc.inc
 +
 +
    *
 +
 +
    *    10 = TEXT
 +
 +
    *    10.value = Your name is: ###USER###
 +
 +
    *    10.postUserFunc = user_UserFunc->getCurrentFEuser
 +
 +
    *    10.postUserFunc.field = name
 +
 +
    *
 +
 +
    */
 +
 +
    function getCurrentFeuser($content,$conf){
 +
 +
        $field = $conf['field'];
 +
 +
        $fedata = $GLOBALS["TSFE"]->fe_user->user[$field];
 +
 +
        return ($fedata ) ? str_replace("###USER###",$fedata , $content) : $content;
 +
 +
    }
 +
 +
 +
 +
 +
 +
    /*
 +
 +
    * Function: getRandomItem()
 +
 +
    *
 +
 +
    * Return a random item from a comma seperated list of items
 +
 +
    *
 +
 +
    * Parameters:
 +
 +
    *
 +
 +
    *    <none>
 +
 +
    *
 +
 +
    * Example:
 +
 +
    *
 +
 +
    *    includeLibs.functions = fileadmin/scripts/UserFunc.inc
 +
 +
    *
 +
 +
    *    10 = COA_INT
 +
 +
    *    10 {
 +
 +
    *      10 =IMAGE
 +
 +
    *      10.file.import = uploads/media/
 +
 +
    *      10.file.import.cObject = TEXT
 +
 +
    *      10.file.import.cObject.field = media
 +
 +
    *      10.file.import.cObject.postUserFunc = user_UserFunc->getRandomItems
 +
 +
    *      10.file.import.listNum = 0
 +
 +
    *    }
 +
 +
    *
 +
 +
    */
 +
 +
    function getRandomItem($content,$conf) {
 +
 +
        if ($content) {
 +
 +
                $item = explode(",",$content);
 +
 +
                return $item[rand(0,count($item)-1)];
 +
 +
        }
 +
 +
    }
 +
 +
 +
 +
 +
 +
    function getRandomItems($content,$conf) {
 +
 +
        if ($content) {
 +
 +
            srand((float) microtime() * 10000000);
 +
 +
            $max = $conf['max'];
 +
 +
            $max = ($max>0) ? $max : 1;
 +
 +
            $item = explode(",",$content);
 +
 +
            $rkeys = array_rand($item,$max);
 +
 +
            for ( $i=0;$i<$max;$i++) {
 +
 +
                $ar[] = $item[$rkeys[$i]];
 +
 +
            }
 +
 +
            return implode(",",$ar);
 +
 +
        }
 +
 +
    }
 +
 +
}
 +
 +
 +
?>
 +
 +
</pre>

Aktuelle Version vom 22. Mai 2006, 11:26 Uhr

Typo3 - TypoScript Grundeinstellungen[Bearbeiten]

Es gibt einige Grundsätzliche Einstellungen die immer wieder gemacht werden müssen. Hier finden sich einige davon. Einige weiterführende Einstellungen finden sich in Typo3 - Tipps und Tricks

XHTML[Bearbeiten]

# DOCTYPE auf XHTML Transitional umstellen 
config.doctype = xhtml_trans
# XML-Prolog aus
config.xmlprologue = none
# Standard XHTML Filter aktivieren (Tags werden kleingeschrieben, ...)
config.xhtml_cleaning = all
# HTML Atribute setzen
config.htmlTag_setParams = xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de"

Spracheinstellungen[Bearbeiten]

HTML-Template einbinden[Bearbeiten]

siehe auch: Typo3 - HTML-Templates Beispiel (das page Objekt muß natürlich vorher definiert werden):

Im TS Template Setup: 

 page.10 = TEMPLATE
 page.10{
   template = FILE
   template.file = fileadmin/templates/main.html
 
   ### Subparts ansprechen ###
   workOnSubpart = DOCUMENT_BODY
 
   # Rootline (Pathway) einfügen ###
   subparts.ROOTLINE < temp.rootline_html
   
   # Hauptinhalt
   subparts.CONTENT < layoutWrap
   subparts.CONTENT.wrap = <div class="content"> | </div>   
   
   #Inhalt rechts
   subparts.CONTENT_RIGHT < styles.content.getRight
   subparts.CONTENT_RIGHT.wrap = <div class="content"> | </div>
  
   # Rand bzw. Header
   subparts.HEADER < styles.content.getBorder
   subparts.HEADER <div class="header"> | </div>
   # subparts.HEADER < temp.flashHeader
  
   ### Hauptnavigation ###
   subparts.NAVI_LINKS < temp.navi_gLayer
  
   ### rechte Navi ###
   subparts.NAVI_RECHTS <temp.naviGRight
    
 }

Einstellungen für das Page Objekt[Bearbeiten]

statische Seiten Simulieren[Bearbeiten]

Einstellungen für das Admin Panel[Bearbeiten]

Spamschutz für Email Adressen[Bearbeiten]

Einstellungen für Bilder[Bearbeiten]

Größe (maximal, minimal, Popups, Skalierung, Bildunterschriften...)

Link to Top[Bearbeiten]

Darstellung von Tabellen[Bearbeiten]

Betrifft hauptsächlich das static Template content(default)

clear.gif und Absätze loswerden[Bearbeiten]

content(default)

externe Links[Bearbeiten]

_self oder _blank, aussehen... styles.content.links.extTarget (bei css_styled_content)

Listenpunkte und Aufzählungen[Bearbeiten]

Layoutauswahl[Bearbeiten]

Inline CSS loswerden[Bearbeiten]

Bei vielen Extensions und bei CSS Styled ImgText liegt das CSS Inline. Besser wäre ist es das CSS komplett in eigene Dateien auszulagern.

CSS per random laden[Bearbeiten]

im typoscritp template: 

# Configuring the Auto-Parser for main template:

plugin.tx_automaketemplate_pi1 {
    # Read the template file:
  content = FILE
  content.file = fileadmin/template/rasterpage-startseite-css.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/template/
}

//---------------------------- random css --------------------------------- 

temp.cssrandom =  PHP_SCRIPT
temp.cssrandom.file = fileadmin/template/random_css.php

 
# 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

/*
/ html templates need a marker named <!--###cssrandom### begin -->random css<!--###cssrandom### end --> in the head
 */

   subparts.cssrandom < temp.cssrandom
}

im html-template: 

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>DER TITEL</title>

<!--###cssrandom### begin -->random css<!--###cssrandom### end -->

</head>

und das ist das random_css.php 

<?php
/***********************
*  Copyright notice
*  GPL
*  @author fabian thommen job@fabtho.net
*/

$relPathPrefix='fileadmin/template/';
$css = array('eins.css','zwei.css','drei.css','vier.css');
$randomzahl = rand(0, count($css)-1);
$content = '<link href="'.$relPathPrefix.'css/'.$css[$randomzahl].'" rel="stylesheet" type="text/css" />';
if (headers_sent()) {
  exit;
}
?>

JavaScript in externe Datei auslagern[Bearbeiten]

Z.B. der kleine JavaScript Schnipsel für das Blur im IE auslagern. Wie bindet man externes JavaScript ein.

Ausgabe einer Spalte Wrappen[Bearbeiten]

Beispiel: 

 #Inhalt rechts
 subparts.CONTENT_RIGHT < styles.content.getRight
 #Ganze Spalte Wrappen
 subparts.CONTENT_RIGHT.wrap = <div class="content_right"> | </div>
 #Einzelnes Element Wrappen 
 subparts.CONTENT_RIGHT.renderObj.stdWrap.wrap=<div class="bordered">|</div>

Ausgabe einer Spalte Wrappen wenn nicht leer[Bearbeiten]

Hier wird das content element nur mit einem div gewrapt wenn es nicht leer ist 

temp.rightContent < styles.content.getRight
temp.rightContent.stdWrap {
  wrap = <div id="right-main"> | </div>
  if.isTrue.numRows < styles.content.getRight
}

(TypoWizard.com 9.1.2006)


Senkrechter Strich bei Wrap[Bearbeiten]

Um bei einem Wrap (zum Beispiel im Menü) zwischen jedem Eintrag einen senkrechten Strich | darzustellen, ist folgende Eingabe möglich: 

 tt_content.menu.20.2.1.NO.linkWrap = | | |*||*| |

Benutzer Funktionen (userFunc)[Bearbeiten]

Beispiele (Quelle: http://typo3.umloud.dk/index.php?id=359 22.5.2006) 


<?php




class user_UserFunc{





    /*

     * Function: getRandomRecordIds()

     *

     * Returns a random comma seperated list of IDs

     *

     * Parameters:

     *

     *    table    -    The table to get the record IDs from

     *    pid - The Page ID of the page where the records are located

     *    max - The number of IDs to return

     *

     * Example:

     *

     *    includeLibs.functions = fileadmin/scripts/UserFunc.inc

     *    

     *    lib.randomRecords = COA_INT

     *    lib.randomRecords {

     *      10 = TEXT

     *      10.wrap = <div id="randomRecords">|</div>

     *      10.preUserFunc = user_UserFunc->getRandomRecordIds

     *      10.preUserFunc.pid = {$lib.randomRecords.pid}

     *      10.preUserFunc.table = {$lib.randomRecords.table}

     *      10.preUserFunc.max = {$lib.randomRecords.max}

     *      10.split.token = ,

     *      10.split.cObjNum = 1

     *      10.split.1 {

     *        10 = RECORDS

     *        10.dontCheckPid = 1

     *        10.tables = {$lib.randomRecords.table}

     *        10.source.current = 1

     *        10.conf.{$lib.randomRecords.table} = COA

     *        10.conf.{$lib.randomRecords.table} {

     *          10 = IMAGE

     *          10.file.import = uploads/tx_bannerimages/

     *          10.file.import.data = field:image

     *          10.file.import.listNum = 0

     *          10.stdWrap.typolink.parameter.data = field:url

     *          10.stdWrap.typolink.wrap = <span>|</span>

     *        }

     *      }

     *    }

     *

     */

    function getRandomRecordIds($content,$conf){

        $lCObj = t3lib_div::makeInstance("tslib_cObj");



        $table = $conf['table'];

        $pid = $conf['pid'];

        $max = $conf['max'];



        $query = 'SELECT * FROM '.$table.' WHERE pid='.$pid.$lCObj->enableFields($table).' ORDER BY RAND() LIMIT 0,'.$max;

        $res = mysql(TYPO3_db,$query);



        $ar = array();

        while($row = mysql_fetch_assoc($res)){

            $ar[] = $row['uid'];

        }

        return implode(",",$ar);

    }





    /*

     * Function: getCurrentFEuser()

     *

     * Return a field from fe_users table

     *

     * Parameters:

     *

     *    field    -    The feusers field to get.

     *

     *    The marker ###USER### is replaced with the returned value

     *

     * Example:

     *

     *    includeLibs.functions = fileadmin/scripts/UserFunc.inc

     *

     *    10 = TEXT

     *    10.value = Your name is: ###USER###

     *    10.postUserFunc = user_UserFunc->getCurrentFEuser

     *    10.postUserFunc.field = name

     *

     */

    function getCurrentFeuser($content,$conf){

        $field = $conf['field'];

        $fedata = $GLOBALS["TSFE"]->fe_user->user[$field];

        return ($fedata ) ? str_replace("###USER###",$fedata , $content) : $content;

    }





    /*

     * Function: getRandomItem()

     *

     * Return a random item from a comma seperated list of items

     *

     * Parameters:

     *

     *    <none>

     *

     * Example:

     *

     *    includeLibs.functions = fileadmin/scripts/UserFunc.inc

     *

     *    10 = COA_INT

     *    10 {

     *      10 =IMAGE

     *      10.file.import = uploads/media/

     *      10.file.import.cObject = TEXT

     *      10.file.import.cObject.field = media

     *      10.file.import.cObject.postUserFunc = user_UserFunc->getRandomItems

     *      10.file.import.listNum = 0

     *    }

     *

     */

    function getRandomItem($content,$conf) {

        if ($content) {

                $item = explode(",",$content);

                return $item[rand(0,count($item)-1)];

        }

    }





    function getRandomItems($content,$conf) {

        if ($content) {

            srand((float) microtime() * 10000000);

            $max = $conf['max'];

            $max = ($max>0) ? $max : 1;

            $item = explode(",",$content);

            $rkeys = array_rand($item,$max);

            for ( $i=0;$i<$max;$i++) { 

                $ar[] = $item[$rkeys[$i]];

            }

            return implode(",",$ar);

        }

    }

}


?>
Abgerufen von „https://wiki.stephanschlegel.de/index.php?title=Typo3_-_TS_Templates&oldid=18426“