\
**Category:** Shopware 6 (German)\
**Created:** [20. Dezember 2022 um 20:28 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699 "2022-12-20T20:28:11Z")\
**Posts on this page:** 16\
**Page:** 1
**Author:**  [@UX4U](https://forum.shopware.com/u/UX4U)\
**Post date:** [20. Dezember 2022 um 20:28 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/1 "2022-12-20T20:28:11Z")
Wie kann man am einfachsten den verwendeten HTML-Code von Dokumenten ansehen und dann das zugehörige CSS anpassen?
Wenn man die erstellten Dokumente öffnet, sind es PDFs und bei einer Vorschau wird nicht der Code von den Twig-Dateien der Dokumente angezeigt, sondern etwas anderes.
---
**Author:**  [@UX4U](https://forum.shopware.com/u/UX4U)\
**Post date:** [3. Januar 2023 um 08:07 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/2 "2023-01-03T08:07:52Z")
@Max_Shop, @Moritz_Naczenski und @MarkusFischer wisst ihr, wie das geht?
---
**Author:**  [@MarkusFischer](https://forum.shopware.com/u/MarkusFischer)\
**Post date:** [3. Januar 2023 um 09:10 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/3 "2023-01-03T09:10:52Z")
Hallo UXU4,
das geht nur über Programmierung sprich Templateanpassungen: [https://docs.shopware.com/de/shopware-6-de/tutorials-und-faq/aenderungen-am-template-vornehmen#anpassungen-am-dokumenten-template](https://docs.shopware.com/de/shopware-6-de/tutorials-und-faq/aenderungen-am-template-vornehmen#anpassungen-am-dokumenten-template). Dieser Artikel liefert dazu einen Ansatz.
Viele Grüße
Markus Fischer
---
**Author:**  [@UX4U](https://forum.shopware.com/u/UX4U)\
**Post date:** [3. Januar 2023 um 09:26 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/4 "2023-01-03T09:26:10Z")
Danke. Ich möchte die erstellten Dokumente in den Entwickler-Tools der Browser ansehen.
Da man aber nur PDFs runterladen kann, kann man nicht richtig nachvollziehen, wie der zugehörige HTML-Code und das angewandte CSS aussieht.
Wenn man das weiß, kann man die Templates viel einfacher anpassen.
Auf den Rechnungen möchte ich die Spaltenbreite anpassen und prüfen, ob #000 als Schriftfarbe angegeben ist. Das geht am einfachsten mit den Entwickler-Tools.
---
**Author:**  [@MarkusFischer](https://forum.shopware.com/u/MarkusFischer)\
**Post date:** [3. Januar 2023 um 10:20 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/5 "2023-01-03T10:20:48Z")
Wenn das Dokument erzeugt wurde, haben die verwendeten Templates keinen Einfluss mehr darauf. Daher wirst Du hier nur weiterkommen, wenn Du Dich mit entsprechenden Sourcen beschäftigst. Bei Fragen dazu wirst Du vermutlich mehr Hilfe im Entwicklerforum bekommen: [https://forum.shopware.com/c/shopware-6-german/programmierung/33](https://forum.shopware.com/c/shopware-6-german/programmierung/33).
---
**Author:**  [@UX4U](https://forum.shopware.com/u/UX4U)\
**Post date:** [3. Januar 2023 um 12:56 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/6 "2023-01-03T12:56:02Z")
Aus dem Template wird ein HTML-Dokument erstellt und daraus ein PDF. Wo kann man sehen, wie das HTML aussieht?
Dann kann man das Template leicht anpassen, jetzt muss man die Stellen raten.
Falls das nicht einfach möglich ist, könntest du bitte einen Issue anlegen, @MarkusFischer?
---
**Author:**  [@Max\_Shop](https://forum.shopware.com/u/Max_Shop)\
**Post date:** [3. Januar 2023 um 14:28 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/7 "2023-01-03T14:28:46Z")
Du kannst dich von hier aus durcharbeiten. Es sind nicht all zu viele Dokumente und die Struktur ist eigentlich recht klar, wenn man HTML/twig lesen kann.
> **[platform/src/Core/Framework/Resources/views/documents at...](https://github.com/shopware/platform/tree/c5caf3a0ec944e0caec347d3fb3d17950a499520/src/Core/Framework/Resources/views/documents)**
>
> c5caf3a0ec944e0caec347d3fb3d17950a499520/src/Core/Framework/Resources/views/documents
---
**Author:**  [@UX4U](https://forum.shopware.com/u/UX4U)\
**Post date:** [3. Januar 2023 um 14:54 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/8 "2023-01-03T14:54:23Z")
@Max_Shop vielen Dank.
Ich kenne dieses Verzeichnis.
Ich habe aber nicht rausgefunden, wie ich die Spaltenbreiten schnell anpassen kann.
Ich möchte auch die Schriftgröße im Footer anpassen, damit ein normaler Mensch die Bankverbindung lesen kann und prüfen, ob für die ganzen Dokumente #000 als Schriftfarbe verwendet wird. Mit den Entwickler-Tools könnte man schnell testen, ob Änderungen angewendet werden und passen.
Das sollte Shopware viel benutzerfreundlicher machen. Es handelt sich schließlich um wichtige Dokumente, die ständig gebraucht werden.
---
**Author:**  [@Max\_Shop](https://forum.shopware.com/u/Max_Shop)\
**Post date:** [4. Januar 2023 um 11:40 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/9 "2023-01-04T11:40:35Z")
>
```auto
footer {
position: fixed;
bottom: 50px;
font-size: 8px;
padding-top: 25px;
}
```
Bei der Tabelle musst du selbst schauen, was genau du anpassen möchtest.
---
**Author:**  [@UX4U](https://forum.shopware.com/u/UX4U)\
**Post date:** [21. Februar 2023 um 08:13 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/10 "2023-02-21T08:13:28Z")
Wie kann ich am einfachsten die Spalte mit den Bestellnummern kleiner und die Spalte mit den Artikelbezeichnungen breiter machen?
Ich sehe keine passenden CSS-Angaben dazu.
Die Bestellnummern-Spalte ist zu breit und die Artikelbezeichnungen-Spalte zu schmal, sodass bei vielen Artikeln mehrzeilige Angaben entstehen, obwohl es leicht in eine Zeile gehen würde.
Wenn man mehrere Artikel bestellt, kann die Rechnung schnell zweiseitig und unübersichtlicher werden.
Beim Footer kann man nicht einfach font-size anpassen, weil dort mehrere Spalten angelegt sind.
---
**Author:**  [@Max\_Shop](https://forum.shopware.com/u/Max_Shop)\
**Post date:** [21. Februar 2023 um 09:12 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/11 "2023-02-21T09:12:03Z")
Ich habe jetzt nicht nachgesehen, aber wenn es momentan noch keine Klassen gibt, welche die Spalten unterscheiden lassen, dann musst du eben selbst solche Klassen anlegen und entsprechend per CSS formatieren.
---
**Author:**  [@UX4U](https://forum.shopware.com/u/UX4U)\
**Post date:** [21. Februar 2023 um 13:14 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/12 "2023-02-21T13:14:07Z")
Ich verstehe nicht genau, wie die Tabelle in [platform/base.html.twig at c5caf3a0ec944e0caec347d3fb3d17950a499520 · shopware/platform · GitHub](https://github.com/shopware/platform/blob/c5caf3a0ec944e0caec347d3fb3d17950a499520/src/Core/Framework/Resources/views/documents/base.html.twig) aufgebaut wird.
Man kann die Spaltenbreiten von den Bestellnummern und Artikelbezeichnungen ändern, wenn man
.line-item-table-header \> th.product-number {
width: 200px;
}
.line-item-table-header \> th.product-label {
width: 240px;
}
von style\_base\_portrait.css.twig anpasst.
---
**Author:**  [@Max\_Shop](https://forum.shopware.com/u/Max_Shop)\
**Post date:** [21. Februar 2023 um 15:53 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/13 "2023-02-21T15:53:11Z")
th ist ja nur der head der Tabelle. Um sicher zu gehen, sollte auch das td. entsprechende Breite zugewiesen werden. Aber generell ist genau das der richtige Ansatz.
---
**Author:**  [@UX4U](https://forum.shopware.com/u/UX4U)\
**Post date:** [21. Februar 2023 um 16:02 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/14 "2023-02-21T16:02:28Z")
Den td-Elementen ist von Shopware keine Breite zugewiesen worden, also orientieren sie sich an den th-Elementen.
Am besten wäre es, wenn man die Dokumente mit den Entwickler-Werkzeugen der Browser untersuchen könnte (@MarkusFischer).
---
**Author:**  [@MarkusFischer](https://forum.shopware.com/u/MarkusFischer)\
**Post date:** [23. Februar 2023 um 07:17 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/15 "2023-02-23T07:17:35Z")
Hallo UX4U,
ich kann Dir leider nicht sagen, ob das so ohne Weiteres möglich wäre. Programmwünsche / Verbesserungsvorschläge könnt Ihr am besten über den öffentlichen Issuetracker ([https://issues.shopware.com/](https://issues.shopware.com/)) anbringen. Mehr könnte ich auch nicht tun.
Viele Grüße
Markus
---
**Author:**  [@UX4U](https://forum.shopware.com/u/UX4U)\
**Post date:** [19. November 2024 um 18:48 UTC](https://forum.shopware.com/t/html-code-von-dokumenten-ansehen-und-das-css-dazu-anpassen/97699/16 "2024-11-19T18:48:39Z")
Hier könnt ihr dafür stimmen, dass man in Shopware 6 den HTML-Code von Dokumenten sehen und dadurch leicht das CSS dazu anpassen kann: [Show HTML code of documents – Have an idea? Share it!](https://feedback.shopware.com/forums/942607-shopware-6-product-feedback-ideas/suggestions/49098695-show-html-code-of-documents)
Je mehr Stimmen wir haben, desto schneller ändert sich was. Also stimmt dafür!