Und nicht vergessen...

Internetsites, die auf unseren Templates basieren, sind

- spätestens 7 Tage nachdem sie online zu erreichen sind -

bei uns anzumelden !

AUSDRUCKen von Seiten

Wie man phpWCMS-Seiten ein druckerfreundliches Outfit verpasst...

Wer sich mit dem Inhalt seiner Internetseiten viel Mühe gegeben hat, der möchte i.A. diese wichtigen Informationen auch gerne in einer attraktiven Form zum Ausdruck anbieten.

Doch mit dem Einbau des [PRINT] ReplacementTags allein ist es nicht getan!

Wir zeigen hier, welche Dateien anzupassen sind und was dabei berücksichtigt werden muß.

Das Problem...

Will man den Inhalt der angezeigten Site im Browser ausdrucken, um interessante Informationen später in Ruhe lesen zu können, ist der erste Versuch sicherlich die Verwendung der Browser-eigenen PRINT-Taste. Allerdings bekommt man da die komplette, im Browser dargestellte Seite zum Druck angeboten, also mit allen Funktionselementen, die für die Navigation erforderlich sind. Bei älteren Browsern ist auch noch das Problem vorhanden, daß der Inhalt so garnicht auf eine DIN A4 Site des Druckers passt...

 

Ganz schön ärgerlich !

 

Es beginnt dann das Jonglieren mit den Druckereinstellungen (... wie war das noch mit der Umschaltung auf Querformat?) Und der Bildhintergrund wird auch noch mit ausgedruckt! So ist der Toner schnell leer!

 

Mit so einem "Vorschlag" wollen wir phpWCMS User unseren Besucher doch lieber nicht konfrontieren. Was machen wir also?

1. Erste Schritte auf dem Weg zum Ziel...

 Na klar, wieso gibt's denn die schönen ReplacemenTags (RT), die Oliver Georgi als Arbeitserleichterung für Administratoren in das Backend eingebaut hat.

Da wir an dieser Stelle der Arbeiten sicherlich über die ersten Hürden mit phpWCMS hinaus sind, sollte der Einbau des RTs [PRINT]AUSDRUCK[/PRINT] keine Schwierigkeit darstellen.

RT für einen Text-Link

<!-- Text-Link zur Aktivierung des Seitenausdrucks -->
<!-- Leerzeichen hinter allen oeffnenden Klammern entfernen -->

[ PRINT]AUSDRUCK[ /PRINT]

RT für einen Link mit Bild/Image

<!-- Image-Link zur Aktivierung des Seitenausdrucks -->
<!-- Leerzeichen hinter allen oeffnenden Klammern entfernen -->

[ PRINT]{ IMAGE:../img/famfamfam/mini/action_print.gif}[ /PRINT]

Gesagt getan... so erhalten wir später im Browser einen aktiven Link, mit dem der Ausdruck der betrachteten Seite ausgelöst werden soll. SOLL !

 

Ja, wie groß ist dann die Enttäuschung, wenn beim ersten, erwartungsvollen Klick auf den neuen Link... eine neues Browserfenster öffnet, mit genau dem gleichen Inhalt, wie die aktive Seite! Was haben wir da nun wieder falsch gemacht ?

 

 

G A R N I C H T S !

 

Das Programm fordert lediglich ein paar weitere Schritte von uns Admins, ohne die wir unser Ziel nicht erreichen werden.

2. Beseitigung von Hürden...

Wie immer im Leben, führen viele Wege nach Rom... Wir wählen den "eleganteren" !

 

OK, OK, ich weiß... die Ausgabe ragt rechts aus dem Layout hinaus. 

Das sollte so nicht sein und gefällt mir selber nicht... Und wird noch geändert !

 

 So, geändert! Das sollte jetzt klappen... hoffe ich

 

Lag einfach an den langen Codezeilen, die nicht automatisch umgebrochen werden ! 

Aber so könnt ihr euch schon mal einlesen und selber ans Ziel kommen

 

Aber in den kommenden Tagen werden natürlich noch einige erklärende Texte und Dumps eingefügt, ganz so, wie ihr es gewohnt seid.

 

3. Aufbereiten des Templates...

Zum Verhindern des Ausdrucks spezieller Bereiche, kann fogende Code-Sequenz im Bereich "Haupt:" des Templates verwendet werden:

<!--NO_PRINT_START//-->
...
... <!-- Alles was hier zwischen steht, wird einfach nicht gedruckt -->
...
<!--NO_PRINT_END//-->

Das bedeutet, daß alle Codezeilen, die mit dieser Sequenz eingeschlossen werden, für den Ausdruck der Seite nicht berücksichtigt werden !
Sie werden einfach ausgelassen ... und genau das ist es doch, was wir wollen

 

Wenn wir also nur den eigentlichen Content-Bereich ausgedruckt haben wollen, dann fassen wir einfach die restlichen, nicht gewünschten Zeilen mit der NO_PRINT-Anweisung ein, wie es im folgenden Beispiel unseres free-L-templates beispielhaft erfolgt ist.

 

Es wurde jeweils der Bereich oberhalb und unterhalb des Content-Bereichs mit der obigen Sequenz umschlossen.

4. Einbau der zusätzlichen Codezeilen im Template

Hier am Beispiel unseres "free-L-templates"

<!--NO_PRINT_START//-->

<!-- Start Template ==================================== -->
<a name="top"></a>

...
...
...

<div class="breadcrumb-BOX">{ BREADCRUMB}</div>

<!--NO_PRINT_END//-->
     <!-- StartDruck -->
<div class="content-BOX">{ CONTENT}
<div class="content-SPACER"></div>
</div>
<div class="revision-BOX">
<div class="revision">Aktualisierung: { DATE_ARTICLE} - { TIME_ARTICLE} / Redakteur: { AUTHOR}</div> 
</div>
     <!-- StopDruck -->
<!--NO_PRINT_START//-->

<div class="TopBackDruck-BOX"><!-- Hilfsnavigation UNTEN -->
...
...
...
<!-- -->
<div id="footer-shadow-L"></div>

<!--NO_PRINT_END//-->

5. Zusätzliche Kopf und Fußzeilen für den Ausdruck

Nicht zwingend, aber wer möchte, kann zusätzlich Header-Logo und Adressdaten angeben...

Datei : ...../template/inc_default/print.tmpl

<!-- free-X-templates-002_2007-03-28            Revision: 2007.05.17
====================================================================
     "print.tmpl" used by the PRINT-RT of "phpwcms_133"
     copyright by "webDESIGN Dagmar Peperkorn"
====================================================================   
//-->

<!-- Ueberschreiben zuvor gesetzter Einstellungen -->
<style type="text/css">
<!-- body { background:#FFF; } -->
</style>
  

<!-- START print-wrapper -->
<div id="printWrapper">

<!-- START print-Header -->
<div id="printHeader">
<img src="templates/print_logo.gif" width="135" height="35" border="0" alt="" />
</div>
<!-- END print-Header -->

<!-- Ausgabebereich - phpWCMS-{ CONTENT } -->
{CONTENT}

<!-- START print-Footer -->
<div id="printFooter">
© 2007 by <strong>webDESIGN Dagmar Pepekorn</strong><br />
<br />
Dieses Dokument ist ausschließlich für den privaten Gebrauch bestimmt.<br />
Jede kommerzielle Nutzung oder die Weitergabe an Dritte<br />
ist ohne vorherige schriftliche Genehmigung der Urheber NICHT zulässig!
</div>
<!-- END print-Footer -->

<!-- START print-URL -->
<div id="printURL">
URL dieser Seite: <a href="{CURRENT_URL}" target="_blank">{CURRENT_URL}</a>
</div>
<!-- END print-URL -->

</div><!-- END print-wrapper -->

6. Zusätzliche STYLE-Anweisungen für einen "ordendlichen" Ausdruck...

Wenn der Ausdruck mit der Monitorausgabe weitgehend identisch sein soll...

Datei : ...../template/inc_css/print_layout.css

/*
====================================================================
name:     print_layout.css                Revision: 2007.05.17/14:00
template: free-S-M-L-XL-002_2007-03-28    Revision: 2007.03.28
copyright 2007 by webDESIGN Dagmar Peperkorn :: phpwcms-templates.de 
==================================================================== 
*/

/* Laden der frontend.css Einstellungen */
/* Damit stehen alle Klassen der frontend.css im Druck zur Verfuegung */
@import url("frontend.css");


/* Ueberschreiben der frontend.css Einstellungen
   ================================================================= 
   Nachfolgend koennen alle Anweisungen eingefuegt werden, 
   die von der Definitionen der Monitoranzeige abweichen sollen.

   Sollen spezielle Klassen im Ausdruck nicht ausgegeben werden,
   so kann das nach folgendem Muster erfolgen:

   .class_not_to_print { display:none; /* KEIN Ausdruck */ }
*/

body { margin:0; text-align:center; background:#FFF; }

.gbInputForm { display:none; /* Gaestebuch-Eingabeblock */ }


/* Zusatzinformationen der Druckausgabe formatieren 
   ================================================================= 
*/

#printWrapper {
 background: #FFF; 
 width: 550px; 
 w\idth: 530px; 
 wi\dth: 550px; 
 margin: 10px auto;   
}

#printHeader {
 text-align: right; 
 margin: 0 0px 15px 0px; 
 padding-bottom: 5px; 
 border-bottom: 1px solid #000;  
}

#printCONTENT { }

#printFooter {
 clear: both; 
 width: 500px; 
 w\idth: 520x; 
 wi\dth: 500px; 
 text-align: center; 
 font-size: 10px; color:#999; background:#FFF; 
 padding: 10px 10px; margin:5px auto; border-top:1px solid #CCC;  
}

#printURL {
 text-align: center; 
 font-size: 10px; 
 margin: 10px 0;
}

Liebe phpWCMS-Freundin, lieber phpWCMS-Freund,

 

wir haben uns alle erdenklich Mühe gegeben, dieses Tutorial so einfach und verständlich wie eben möglich zu gestalten, ohne etwas zu vergessen. Trotz eines recht komplexen Inhalts, soll das Thema ja besonders von den Newbees unter den Besuchern verstanden und auf eigenen Internet-Sites umsetzbar sein. 

Der Lohn der ganzen Arbeit... besteht für uns aus dem Wissen, Anderen geholfen zu haben.

Aus diesem Grunde würden wir uns besonders freuen - als kleine Aufmerksamkeit - euren Eintrag in unserem Gästebuch wiederzufinden. Dabei braucht das nicht einmal Lob sein!

Wir freuen uns ebenfalls über "kreative" Kritik, denn dann haben auch wir etwas, an dem wir weiter "arbeiten" können. (Leider nimmt Spam Überhand und das Internet macht zunehmend "weniger Freude", wir haben deshalb das Gästebuch geschlossen!)

 

In diesem Sinne und mit freundlichen Grüßen

pepe 

 

So, das paßt ja gut! Jeden Moment ist meine Tasse Darjeeling fertig...

all-inkl.com webhosting

Weiter im Text ?

Wenn es hier weiter gehen soll...

Da wir nur in den seltensten Fällen Rückmeldungen erhalten, ob unsere Tutorials überhaupt benötigt werden, eine kleine Bitte:

 

Wer zu diesem Thema gerne die fehlenden Informationen haben möchte, sollte uns doch einen kleinen Eintrag dazu in unser Gästebuch schreiben.

 

Wir arbeiten nämlich äußerst ungerne an "unnützem Zeugs"! 

Aktualisierung: 23.10.2011 - 12:11 / Redakteur: mp
eine Seite zurückzum SeitenanfangGästebuch'druckerfreundliche' Seite anzeigenzur Homepage