TYPO3 Druckansicht mit Hinweis-Icon

Eine TYPO3 Installation soll eine Druckansicht mit Hinweis-Icon bekommen. Das ganze sollte ohne Extension, nur mit Typoscript realisiert werden.

  1. Ein passendes Icon wird kopiert nach fileadmin/img/printbutton.gif.

  2. Um das Icon zu platzieren muss es vorher definiert werde, in der HTML-Volage der Inhalts-Seiten. Dazu wird in die HTML-Vorlage ein Platzhalter eingefügt.
    Achtung: Wenn mehrere Elemente in einer Zeile in einem Rahmen stehen ist darauf zu achten, dass der Print Button zuletzt platziert wird. Ansonsten kann es passieren, dass das Print-Icon zwar sichtbar ist, aber keinen Link zeigt, wenn man mit dem Mauszeiger darüber fährt. Um die Größe des Platzhalters zu sehen, kann man in der CSS Definition einen Rahmen zeichnen mit "border:1px solid red;"
    Platzhalter Beispiel:

<div id="printbutton">###PRINTBUTTON###</div>
  1. Bei dem Master_Template wird ein Unter-Template mit Namen printbox erzeugt. Dort wird das Template PRINTBUTTON als COBJ_ARRAY (COA) definiert. Mit wrap wird das Hinweis-Icon (Drucker Symbol) definiert. Mit der nächsten Zeile (wrap auskommentiert) würde ein Hinweis-Text Druckansicht realisiert.
    Als nächsten wird mit 10 = TEXT ein Text-Objekt definiert. Das bekommt mit 10.data = TSFE:id die Seiten-Id Nummer der aktuellen Seite zugewiesen. Dann wird mit 10.wrap = index.php?id=|&type=98 die Web-Adresse vorbereitet, mit Seiten-Id Nummer und Typ 98, der für Druckansicht steht.
    Dieses Unter-Template wird dann im Root-Template in den Seiteninhalt eingebunden mit marks.PRINTBUTTON < temp.PRINTBUTTON.
    Das zeigt beim überfahren des Drucker-Icons mit der Maus in der Statuszeile folgenden Link http://www.website.de/index.php?id=xxx&type=98, der beim anklicken des Drucker-Icons dann aufgerufen wird.

    Wenn man RealURL benutzt, sind die zwei folgenden Beispiele passend, zuerst mit Text-Marker, dann mit Grafik-Marker. Dann sieht die URL so aus: http://www.website.de/seite.98.html.

# Drucksymbol in jedem Seitenkopf : 2009-12-29 RR
temp.PRINTBUTTON = COA
temp.PRINTBUTTON {
     wrap = <a href="|" name="Drucken" title="Drucken" target="_blank" class="print"><img  src="fileadmin/img/printbutton.gif"></a>
     #wrap = <a href="|" name="Drucken" title="Drucken" target="_blank" class="print">Druckansicht</a>
     10 = TEXT
     10.data = TSFE:id
     10.wrap = index.php?id=|&type=98
}
oder
# von Praxiswissen S.268, das funktioniert, ist aber nur TEXT
marks.PRINTBUTTON = TEXT
marks.PRINTBUTTON {
    value = Druckversion
    typolink.parameter.dataWrap = {page:uid},98
    typolink.target = _blank
    typolink.addQueryString = 1
}
oder
# mit Grafik Button
marks.PRINTBUTTON = IMAGE
marks.PRINTBUTTON {
    file = fileadmin/img/printbutton.gif
    imageLinkWrap = 1
    imageLinkWrap.enable = 1
    imageLinkWrap.typolink.target = _blank
    imageLinkWrap.typolink.parameter.dataWrap = {page:uid},98
    altText = printbutton
    titleText = Diese Seite Drucken
    #typolink.addQueryString = 1
}
  1. Am besten am Ende des Root-Templates fügt man dann die Typoscript Befehle ein, um die Druckansicht aufzurufen, mit gestartetem Drucken-Fenster. Zur Erklärung der Befehle.
    Zuerst wird ein neues Seitenobjekt angelegt print = PAGE, damit überhaupt eine Ausgabe stattfinden kann, dann bekommt das Objekt die Typnummer 98 (drucken) zugewiesen. Mit stylesheet = ... wird ein passendes Stylesheet eingebunden. In den bodyTag kommt der JavaScript Befehl, um das Drucken-Fenster in dem neuen Web-Browser Fenster/Tab Druckansicht zu öffnen. Innerhalb des Seiten-Objekts an der Stelle 10 wird das Objekt CONTENT angelegt, das über verschiedene TypoScript-Parameter gesteuert wird. Alternativ kann, wenn die Extension "CSS styled content" geladen ist, mit dem Befehl 10 < styles.content.get das gleiche erreicht werden. Ein Link dazu "1.2 Inhalte einlesen" von der original TYPO3 Dokumentation http://typo3.org/documentation/document-library/extension-manuals/ts45min_de/0.5.1/view/1/2/

print = PAGE
print {
    typeNum = 98
    stylesheet = fileadmin/css/print.css
    # wenn kein stylesheet, dann muss das alles in den "body" hinein!
    #bodyTag = <body onload="javascript:window.print()" bgcolor = "#ffffff" margin-left:1px margin-top:1px>
    bodyTag = <body onload="javascript:window.print()">
    10 = CONTENT
    10.table = tt_content
    10.select.orderBy = sorting
    10.select.colPos = 0
    # wenn die Extension "CSS styled content" geladen ist
    #10 < styles.content.getLeft
    #10 < styles.content.get
}
  1. Zur Formatierung der Druckseite wird ein CSS Stylesheet eingesetzt (fileadmin/css/print.css). Zum kompakteren Ausdrucken wird die Fontgröße auf 80% verkleinert. Damit in der Druckansicht das Seiten-Layout nicht zerrissen wird, wie in der Web-Browser Druckvorschau, wird die Seitenbreite auf maximal 800 Pixel begrenzt. Der auskommentierte Seiten Hintergrund in gelb wird zum testen der CSS Wirkung eingesetzt.

/* Stylesheet for printing content only 2009-12-29 RR */

html {height:100%; margin-bottom:1px;}

body {
    color: black;
    background-color: rgb(255,255,255);
    font-size: 80%;
    font-family: Helvetica,Arial,sans-serif;
    margin: 0;
    max-width:800px;
    /*text-align: center;*/  /* center in Internet Explorer */
}

div#Page {
    text-align: left;    /* align page content left */
    max-width: 800px;
    font-size: 80%;
    padding: 0.5em;
    background-color: rgb(255, 255, 255);
    /*background-color: yellow;*/
}

div#ContentLayer {
    margin-left: 0px;
    padding: 0 1em;
    border: 1px dashed silver;
    max-width:800px;
    /*background-color: yellow;*/
}

div#ContentLayer h1 {
    font-size: 1.1em;
    margin: 0 0 1em;
}

div#ContentLayer h2 {
    font-size: 1.0em;
    margin: 0 0 1em;
}

div#ContentLayer p {
    font-size:0.9em;
    margin: 1em 0;
}

Liste der Seiten in dieser Category


RudolfReuter 2009-12-30

Go Back to CategoryTypo3 or StartSeite ; KontaktEmail (ContactEmail)

Typo3Druckansicht (last edited 2011-03-23 09:02:54 by dslb-084-058-142-238)