Layout der Magento PDF-Rechnung anpassen
Mit meiner Advanced Invoice Layout Magento-Extension lässt sich das Standardlayout der PDF-Rechnung, des PDF-Lieferscheins und der PDF-Gutschrift sehr einfach via HTML/CSS anpassen.
Einige Beispiele gefällig? Sehen Sie sich die PDF-Rechnungslayouts meiner Kunden an.
PDF-Layouts für Magento 1 anpassen
- Die CSS-Dateien befinden sich im Verzeichnis
skin/frontend/base/default/advancedinvoicelayout/default/css/
der Magento-Installation. Zusätzlich zu den regulären CSS-Dateien liefern wir auch die Original-SASS-Dateien mit, mit denen sich die CSS-Dateien noch leichter anpassen lassen. - Die HTML-Dateien, aus denen die PDF-Rechnung generiert wird, befinden sich im Verzeichnis
app/design/frontend/base/default/template/advancedinvoicelayout/default/
.
Die PDF-Dokumente können über folgende Aktionen gedruckt werden:
- Verkäufe › Rechnungen › Aktionen › PDF-Rechnung drucken über das Grid oder über
- Verkäufe › Rechnungen › Rechnung auswählen › PDF-Rechnung drucken auf der Rechnungsdetailseite
Die Dokumente werden jeweils on-the-fly generiert, d.h. Änderungen an den HTML/CSS-Dateien sind sofort sichtbar.
Generell empfiehlt es sich, zum Testen von Layouts immer den Debug-Modus der Advanced Invoice Layout Extension unter System › Konfiguration › Advanced Invoice Layout zu aktivieren. Bei aktiviertem Debug-Modus wird bei jedem Druck der PDF-Rechnung, des -Lieferscheins oder der -Gutschrift das temporär erzeugte HTML-Dokument im Verzeichnis var/tmp/invoice_debug.html
gespeichert. Dies ermöglicht Ihnen einfacher, die HTML-Struktur und die Style-Sheets zu analysieren und anzupassen.
In Produktiv-Umgebungen sollte dieses Feature aus Performance-Gründen nicht dauerhaft aktiviert sein.
Eigenes Theme erstellen
Standardmäßig wird die Advanced Invoice Layout Extension mit dem default-Theme ausgeliefert, das für die meisten Anwendungsfälle bei unseren Kunden sehr gut geeignet ist und aus Usability optimiert ist. Selbstverständlich ist es aber sehr einfach möglich, eigene Themes zu erstellen und z.B. für verschiedene StoreViews unterschiedliche Layouts zu verwenden. Ein Theme ist hierbei ein über HTML/CSS angepasstes Layout.
Für die folgenden Schritte sind grundlegende Entwickler-Kenntnisse von Vorteil.
Um ein eigenes Theme zu erstellen müssen folgende Schritte durchgeführt werden:
- Hinzufügen des Themes mit Code "EIGENES-THEME" in
app/code/community/Vianetz/AdvancedInvoiceLayout/etc/config.xml
(oder idealerweise über ein separates Modul, da alle XML-Dateien zur Runtime verbunden werden)<default> <advancedinvoicelayout> <themes> <default title="Default PDF layout by vianetz"/> </themes>
- Kopieren aller Dateien im Verzeichnis
app/design/frontend/base/default/template/advancedinvoicelayout/default
nachapp/design/frontend/base/default/template/advancedinvoicelayout/EIGENES-THEME
- Kopieren aller Dateien im Verzeichnis
skin/frontend/base/default/template/advancedinvoicelayout/default
nachskin/frontend/base/default/template/advancedinvoicelayout/EIGENES-THEME
- Anpassungen an den HTML/CSS-Dateien in den neuen Verzeichnissen vornehmen
- Magento Cache leeren
- Anschließend kann das eigene Theme in System › Konfiguration › Advanced Invoice Layout ausgewählt werden
Unterschiedliche PDF-Layouts pro Store
Prinzipiell haben Sie hierzu mehrere Möglichkeiten:
Unter System › Konfiguration › Advanced Invoice Layout können Sie nach der Installation der Extension bereits StoreView-abhängige Einstellungen vornehmen. Hierzu müssen Sie einfach im Store-Switcher oben links entsprechend den gewünschten Store auswählen und die Einstellungen vornehmen.
Wenn Sie darüberhinaus auch Layout-Anpassungen an den HTML/CSS-Dateien vornehmen möchten, gibt es 2 Möglichkeiten:
- Wenn Sie für die Stores bereits unterschiedliche Magento-Themes verwenden, können Sie einfach die Anpassungen im entsprechenden Theme-Folder vornehmen. D.h. Sie nehmen die Anpassungen z.B. in
app/design/frontend/theme1/default/advancedinvoicelayout
undapp/design/frontend/theme2/default/advancedinvoicelayout
vor. - Darüberhinaus gibt es auch die Möglichkeit (z.B. wenn Sie dasselbe Theme für beide Stores verwenden) eigene Themes im Advanced Invoice Layout Modul anzulegen.
Häufige Fragen zum Magento PDF Layout
Change font family in Magento PDF invoice layout
Attribute der Bestellung auf der Magento Rechnung oder dem Lieferschein anzeigen
Um individuelle Felder/Attribute aus der Bestellung auf der PDF-Rechnung, dem -Lieferschein oder der -Gutschrift anzeigen zu können, gibt es mit unserem Advanced Invoice Layout Modul 2 Möglichkeiten (hier anhand des fiktiven Attributs my_attribute
auf der Magento-Bestellung):
- Über die Konfiguration kann in allen Textfeldern, z.B. im Freitext-Feld der Platzhalter
{{var order.getMyAttribute()}}
verwendet werden oder - es können direkt die PHP/HTML-Templates editiert werden und folgender Code an entsprechender Stelle eingefügt werden:
echo $this->getOrder()->getMyAttribute();
Artikeloptionen nebeneinander anzeigen
Mit folgendem CSS-Code können die Artikel-Optionen in den Magento PDF-Layouts anstatt in einer Liste nebeneinander angezeigt werden:
#itemTable ul.itemOptionList { list-style-type: none; padding: 0; }
#itemTable ul.itemOptionList li { display: inline; }
Available Variables for Magento PDF Layouts
Cyrillic characters are displayed as "?" on the Magento PDF invoice. What can I do?
The problem is that the chosen font family does not support the Cyrillic characters. So far no font with Cyrillic support is included into the Advanced Invoice Layout Extension. That means that you have to get your own font family with support for Cyrillic characters and include it into the Advanced Invoice Layout Extension.
Please also see my FAQ article about adding a new font.
Das Magento PDF-Layout wird nicht korrekt angezeigt - was kann ich tun?
Wenn Sie meine Advanced Invoice Layout Extension für die Anpassung des PDF-Layouts von Rechnungen, Lieferscheinen und Gutschriften verwenden und das PDF nicht wie gewünscht gedruckt wird, gibt es mehrere Fehlermöglichkeiten:
- Falls Sie URLs in dem Layout verwenden, muss in der PHP-Konfiguration die Option
allow_url_fopen
aktiviert sein. - Wurde die Extension gemäß der Installationsanleitung installiert? Sind insbesondere alle Dateien korrekt hochgeladen?
Falls sich Ihr Problem damit nicht beheben lässt, kontaktieren Sie mich gerne.
How can I access the base64-encoded PDF file?
There may be circumstances where you need the base64-encoded value of one of the PDF documents in Magento 2 like creditmemo, e.g. for sending it other 3rd-party systems.
This can easily be achieved with the following sample code. This code assumes that you have \Vianetz\AdvancedInvoiceLayout\Model\PdfManager $pdfManager
and e.g. \Magento\Sales\Api\CreditmemoRepositoryInterface $creditmemoRepository
available, for example via Constructor Dependency Injection or as shown by direct Magento 2 Object Manager creation.
$objectManager = \Magento\Framework\App\ObjectManager::getInstance();
$pdfManager = $objectManager->create('Vianetz\AdvancedInvoiceLayout\Model\PdfManager');
$creditmemo = $objectManager->create('Magento\Sales\Api\CreditmemoRepositoryInterface')->get($creditmemoId);
$pdfManager->addSource($creditmemo);
// output the base64-encoded value
echo base64_encode($this->pdfManager->getPdf()->getContents());
This code uses parts of my PDF API for Magento.
How can I force a page break in the Magento invoice PDF?
A page break can be forced in the invoice PDF by adding an HTML element with the CSS class pageBreak
.
Migrate Advanced Invoice Layout templates from Magento 1 to Magento 2
If you use our Advanced Invoice Layout extension for Magento 1 and you want to migrate your shop to Magento 2, there are a few simple steps to make the invoice, packing slips and creditmemo PDF look nice:
- Purchase the Advanced Invoice Layout extension for Magento 2
- Copy all your template files from the Magento 1 extension from
app/design/frontend/base/default/template/advancedinvoicelayout
to the Magento 2 extension inview/base/templates/
- Copy all the CSS files from Magento 1 from
skin/frontend/base/default/advancedinvoicelayout
to the Magento 2 extension inview/base/web/
- Replace all occurrences of
$this->__( .. %s .. )
with$this->__( .. %1 .. )
Schweizer QR-Rechnung mit Magento generieren
Wie kann ich das Adressformat konfigurieren?
Wie kann ich die Übersetzungen in den PDF-Dokumenten ändern?
Jedes Modul wird mit Übersetzungsdatei im Verzeichnis app/locale/..
ausgeliefert. Je nach gewünschter Sprache (z.B. deutsch) befindet sich in der Datei im Unterverzeichnis de_DE/Vianetz_AdvancedInvoiceLayout.csv
alle verwendeten Text-Strings.
Alternativ können die Texte auch über die Magento Inline-Translation im Backend geändert werden.
Wie kann ich zusätzliche Hinweise für Firmenkunden auf die PDF-Rechnung drucken?
Die Advanced Invoice Layout Extension bietet die Möglichkeit, kundengruppenspezifische Rechnungstexte unter Kunden › Kundengruppen im Magento Backend zu hinterlegen.
Damit können z.B. benötigte Hinweise für Firmenkunden oder Notizen wie "Steuerbefreit gemäß Paragraph X" oder "Steuerschuldnerschaft des Leistungsempfängers / Reverse-Charge-Verfahren" in die PDF-Rechnung hinzugefügt werden:

Wieso wird die Steuer doppelt in der Rechnung ausgewiesen?
Die Konfigurationsoption System › Konfiguration › Steuern › Anzeige in Bestellungen, Rechnungen, Gutschriften › Steuern vollständig anzeigen beeinflusst dieses Verhalten. Im Frontend kann der Kunde auf den Steuersatz klicken und erhält die Aufsplittung in die einzelnen Mehrwertsteuerklassen. In den Emails und PDF-Dokumenten ist dies allerdings ungünstig, da hier alle Steuersätze + der Gesamtsteuersatz angezeigt werden und somit redundante, doppelte Informationen vorliegen, die Kunden eher verwirren.
Die Advanced Invoice Layout Extension berücksichtigt diesen Fall und zeigt - je nach Einstellung - nur den Gesamtsteuersatz oder nur die aufgesplitteten Steuersätze nach ihrem Prozentsatz.
Sofern nur 1 Steuersatz vorliegt könnte theoretisch auch die Steuerbezeichnung in den Übersetzungen geändert werden, dies ist aber ausdrücklich nicht empfohlen.
Zahlart auf der Magento PDF-Rechnung anpassen
Beispiele für PDF-Layouts von Kunden
Im Folgenden zeige ich einige Beispiele aus realen Magento Online-Shops unserer Kunden, die mit der Advanced Invoice Layout Extension das PDF-Rechnungslayout angepasst haben:
Kunde seit 2013
Kunde seit 2014
Kunde seit 2011
Kunde seit 2014
Kunde seit 2014
Kunde seit 2013
Kunde seit 2009
Kunde seit 2017
Kunde seit 2013
Kunde seit 2016
Kunde seit 2014
Kunde seit 2020
Wenn Sie meine Magento Extension im Einsatz haben und gerne Ihr PDF-Layout hier präsentieren möchten oder eine Aufnahme als PDF-Template in die Extension ermöglichen können, freue ich ich jederzeit über eine Kontaktaufnahme.