Zum Hauptinhalt springen
Mit dem URL-Parameter wsfilter=pdf kann jede Shop-Seite als PDF ausgegeben werden. Das System interpretiert die aufgerufene URL wie gewohnt, gibt die Seite jedoch nicht als HTML aus, sondern wandelt sie serverseitig in ein PDF-Dokument um. Das Ergebnis kann dem Benutzer direkt im Browser angezeigt oder als Datei zum Download angeboten werden.
Dynamisch erzeugte PDFs können derzeit nicht automatisch als E-Mail-Anhang versendet werden. Sie lassen sich aber als Download-Link bereitstellen - auf einer Shop-Seite oder in einer E-Mail (siehe PDF-Download in einer E-Mail).

Module

Zwingend benötigt wird nur das Modul $wsViews, um viewUrl() und View-Informationen verwenden zu können. Die Verwendung anderer Module hängt vom jeweiligen Seitenkontext ab, aus dem ein PDF erzeugt werden soll.

URL-Parameter

ParameterWertPflichtBeschreibung
wsfilterpdfjaGibt die Seite als PDF aus.
wsfilterNamedateiname.pdfneinLegt den Dateinamen der erzeugten PDF inklusive .pdf-Endung fest.
Ohne Angabe vergibt das System einen Standardnamen.

Funktionsweise

Beliebige Shop-Seite als PDF ausgeben

Der einfachste Weg ist, ?wsfilter=pdf an eine beliebige Shop-URL anzuhängen. Das System rendert dann die aufgerufene Seite inklusive Navigation, Header und Footer und gibt sie als PDF aus. Beispiel für eine Produktseite:
https://demo.shop.websale.biz/mein-produkt/?wsfilter=pdf
Ein klickbarer Link lässt sich auf jeder Seite wie folgt einbinden:
<a href="{{= $wsViews.host }}{{= $wsViews.current.url() }}?wsfilter=pdf">
  Diese Seite als PDF herunterladen
</a>

Eigenes Template für die PDF-Ansicht verwenden

Wenn die PDF anders aussehen soll als die normale Shop-Seite, zum Beispiel ohne Navigation, Header oder Footer, muss dafür ein eigenes Template angelegt werden. Eine PDF-Ansicht ist ein normales View-Template, das wie jedes andere View-Template im Verzeichnis “templates/views/” abgelegt und über $wsViews.viewUrl() verlinkt wird. Um die Ausgabe als PDF zu erzwingen, wird beim Aufruf zusätzlich der Parameter wsfilter=pdf übergeben. Beispielaufruf des eigenen Templates als PDF:
<a href="{{= $wsViews.viewUrl('pdf/meintemplate.htm', {
    wsfilter: 'pdf',
    wsfilterName: 'dateiname.pdf'
}) }}">
  Als PDF herunterladen
</a>
Sollen mehrere PDFs in einem einheitlichen Design angeboten werden, kann ein Layout-Template erstellt werden (z.B. layouts/pdf.htm), das Header, Footer und Seitenstruktur vorgibt und von den einzelnen PDF-Views per extends eingebunden wird. Wie Layout-Templates funktionieren, wird unter Template Theme beschrieben.

Datenverfügbarkeit im PDF-Template

Ein PDF-Template wird serverseitig genauso erzeugt wie eine normale Shop-Seite. Es bietet deshalb denselben Zugriff auf Module wie jedes andere Shop-Template. Das bedeutet, dass die Daten nicht eigens übergeben oder neu aufgebaut werden müssen. Entscheidend für die Verfügbarkeit der Module ist, in welchem Kontext die PDF erzeugt wird:
  • Session- und shopweite Daten stehen immer zur Verfügung, unabhängig davon, welches Template gerade verwendet wird. Dazu gehören z.B. der Warenkorb ($wsBasket), das Kundenkonto samt Adressen ($wsAccount) oder Konfigurationswerte ($wsConfig). Ein Warenkorb-PDF kann den Warenkorb also beispielsweise direkt über $wsBasket auslesen.
  • Seitenkontext-bezogene Daten - beispielsweise das aktuell aufgerufene Produkt oder die aktuelle Kategorie - sind an den jeweiligen Seitenkontext gebunden und über $wsViews.current.info erreichbar. Ein Produkt-PDF muss daher aus dem Kontext des jeweiligen Produkts heraus erzeugt werden, damit die Produktdaten geladen werden.

Beispiele

Warenkorb als PDF ausgeben

Um im Warenkorb eine PDF-Version der Warenkorbseite anzubieten, wird ein PDF-Template benötigt, das den Warenkorb darstellt, sowie einen Download-Link, über den dieses Template als PDF aufgerufen werden kann. Der Download-Link wird in das Template der Warenkorbseite eingebunden (z.B. basket.htm der genaue Name hängt davon ab, wie die Warenkorbseite im jeweiligen Shop benannt wurde. Er ruft das PDF-Template auf und hängt wsfilter=pdf an.
<a href="{{= $wsViews.viewUrl('pdf/basket.htm', {
    wsfilter: 'pdf',
    wsfilterName: 'warenkorb.pdf'
}) }}">
  Warenkorb als PDF herunterladen
</a>
Das zugehörige PDF-Template (hier views/pdf/basket.htm) liest die Warenkorb-Daten direkt über $wsBasket aus.
<!doctype html>
<html lang="de">
<head>
   <meta charset="utf-8">
   <style>
      //Styling der Datei
   </style>
</head>
<body>
   <h1>Warenkorb</h1>

   <table>
      <thead>
         <tr>
            <th colspan="2">Produkt</th>
            <th>Menge</th>
            <th>Preis</th>
         </tr>
      </thead>
      <tbody>
         {{ foreach $cItem in $wsBasket.items }}
            <tr>
               <td>
                  <img src="{{= $cItem.product.custom.image.thumbnail | ifNull(static('images/noImageThumbnail.jpg')) }}"
                       alt="{{= $cItem.product.name }}">
               </td>
               <td>
                  {{ if $cItem.product.custom.brand }}
                     {{= $cItem.product.custom.brand }}<br>
                  {{ /if }}
                  {{= $cItem.product.name }}
                  {{ foreach $cVarAttr in $cItem.product.variantSelection | keys }}
                     <br>{{= $cVarAttr }}: {{= $cItem.product.variantSelection[$cVarAttr] }}
                  {{ /foreach }}
               </td>
               <td>{{= $cItem.quantity | preparedFormat('amount') }}</td>
               <td>{{= $cItem.total | currency }}</td>
            </tr>
         {{ /foreach }}
      </tbody>
   </table>

   <table>
      <tbody>
         <tr>
            <td>Zwischensumme</td>
            <td>{{= $wsBasket.subTotal | currency }}</td>
         </tr>
         {{ if $wsBasket.shippingCosts > 0 }}
         <tr>
            <td>Versandkosten</td>
            <td>{{= $wsBasket.shippingCosts | currency }}</td>
         </tr>
         {{ /if }}
         <tr>
            <td>Gesamtsumme</td>
            <td{{= $wsBasket.total | currency }}</td>
         </tr>
      </tbody>
   </table>
</body>
</html>

Bestelleingangsbestätigung als PDF bereitstellen

Ein häufiger Anwendungsfall ist es, dem Kunden nach einer erfolgreichen Bestellung eine PDF-Bestelleingangsbestätigung anzubieten. Wie jede andere PDF-Ansicht wird sie über ein PDF-Template (hier abgelegt unterviews/pdf/bestellbestaetigung.htm), das die Bestelldaten darstellt und mit dem Parameter wsfilter=pdf aufgerufen wird, erzeugt. Da die Bestelldaten an den Kontext der abgeschlossenen Bestellung gebunden sind, wird der Download-Link auf der Bestellbestätigungsseite platziert, die der Kunde direkt nach dem Bestellabschluss sieht.
<!doctype html>
<html lang="de">
<head>
   <meta charset="utf-8">
   <style>
      //Styling der Datei
   </style>
</head>
<body>
   <h1>Bestelleingangsbestätigung</h1>
   <p>Vielen Dank für Ihre Bestellung.</p>

   <h2>Rechnungsadresse</h2>
   {{ var $cBillAddress = $wsAccount.loadAddress($wsCheckout.selectedBillAddress) }}
   {{= $cBillAddress.firstName }} {{= $cBillAddress.lastName }}<br>
   {{= $cBillAddress.street }} {{= $cBillAddress.streetNumber }}<br>
   {{= $cBillAddress.zip }} {{= $cBillAddress.city }}<br>
   {{= $cBillAddress.country }}

   {{ if $wsCheckout.selectedBillAddress != $wsCheckout.selectedShippingAddress }}
      <h2>Lieferadresse</h2>
      {{ var $cShippingAddress = $wsAccount.loadAddress($wsCheckout.selectedShippingAddress) }}
      {{= $cShippingAddress.firstName }} {{= $cShippingAddress.lastName }}<br>
      {{= $cShippingAddress.street }} {{= $cShippingAddress.streetNumber }}<br>
      {{= $cShippingAddress.zip }} {{= $cShippingAddress.city }}<br>
      {{= $cShippingAddress.country }}
   {{ /if }}

   <h2>Versandart</h2>
   {{ foreach $cShipping in $wsConfig.shippingMethods }}{{ if $wsCheckout.selectedShippingMethod == $cShipping.id }}{{= $cShipping.name }}{{ /if }}{{ /foreach }}

   <h2>Zahlungsart</h2>
   {{ foreach $cPayment in $wsConfig.payments }}{{ if $wsCheckout.selectedPayment == $cPayment.id }}{{= $cPayment.name }}{{ /if }}{{ /foreach }}

   {{ foreach $cFreeField in $wsCheckout.freeFields }}
      {{ if $cFreeField.id == "comment" and $cFreeField.text }}
         <h2>{{= $cFreeField.name }}</h2>
         {{= $cFreeField.text }}
      {{ /if }}
   {{ /foreach }}
</body>
</html>
Der Download-Link wird auf der Bestellbestätigungsseite platziert, die der Kunde direkt nach dem Bestellabschluss sieht:
<a href="{{= $wsViews.viewUrl('pdf/bestellbestaetigung.htm', {
    wsfilter: 'pdf',
    wsfilterName: 'bestellbestaetigung.pdf'
}) }}">
  Bestelleingangsbestätigung als PDF herunterladen
</a>
PDF-Dateien können als Download Link in E-Mail-Templates (z.B. der Bestellbestätigungs-E-Mail) zur Verfügung gestellt werden. Dabei wird das PDF nicht an die E-Mail angehängt, sondern beim Klick auf den Link in der E-Mail erzeugt. Der Link wird nach dem bereits bekannten Schema gebildet. Dabei sind zwei Dinge wichtige: der Typ “absolute”, weil E-Mails vollständige URLs benötigen und die Parameter, die den Inhalt eindeutig identifizieren (z.B. voucherId, productId. So kann das PDF unabhängig von der Session erzeugt werden. Beispiel: Download-Links im E-Mail-Template für gekaufte Gutscheine, das versendet wird, nachdem Gutscheine über den Shop gekauft wurden.
{{ foreach $basketItem in $wsBasket.items }}
   {{ if $basketItem.product.custom.voucherProductActive }}
      {{ foreach $voucherId in $basketItem.voucherIds }}
         <a href="{{= $wsViews.viewUrl('voucher/default_voucher.htm', {
             voucherId: $voucherId,
             productId: $basketItem.product.id,
             wsfilter: 'pdf'
         }, 'absolute') }}">
            Gutschein {{= $voucherId }} herunterladen
         </a>
      {{ /foreach }}
   {{ /if }}
{{ /foreach }}
In diesem Beispiel ist voucher/default_voucher.htm das PDF-Template, das die Gutschein-Daten anhand der übergebenen voucherId und productId ausgibt.