> For the complete documentation index, see [llms.txt](https://docs.hubyte.de/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.hubyte.de/pdf-dokumenten-template-bearbeiten/bestellpositionen-tabelle.md).

# Tabelle der Bestellpositionen

Die Karte **„Dokumenten Template bearbeiten (Bestellposition)"** enthält zwei Felder, mit denen Sie die Darstellung der Positionstabelle vollständig kontrollieren:

* **Styles für die Tabelle der Bestellpositionen** – das CSS der Tabelle
* **Tabelle für Bestellpositionen (Twig-Template)** – das Twig-Template der Tabelle *(Experteneinstellung)*

> **Hinweis:** Diese Einstellungen sind für fortgeschrittene Anwender gedacht. Wir empfehlen, mit **Standardvorlage laden** zu beginnen und nur gezielte Anpassungen vorzunehmen.

## Das Twig-Template der Positionstabelle

Das Template wird in **drei Phasen** gerendert. Die Variable `hueRenderPhase` steuert, welcher Teil gerade ausgegeben wird:

| `hueRenderPhase` | Bedeutung                                                      |
| ---------------- | -------------------------------------------------------------- |
| `table`          | Tabellenkopf (`<thead>`, Spaltenüberschriften)                 |
| `position`       | Eine einzelne Position (eine `<tr>`-Zeile pro Bestellposition) |
| `shipping`       | Die Versandkostenzeile                                         |

Ein vereinfachtes Grundgerüst sieht so aus:

```twig
{% if hueRenderPhase == 'table' and config.displayLineItems %}
    <table class="line-item-table">
        <thead>
        <tr class="line-item-table-header">
            <th class="product-number">Prod.-Nr.</th>
            <th class="product-label">Produkt / Dienst</th>
            <th class="numbers">Anzahl</th>
            {% if config.displayPrices %}
                <th class="numbers">USt.</th>
                <th class="numbers incl-vat">Stückpreis</th>
                <th class="numbers incl-vat">Gesamt</th>
            {% endif %}
        </tr>
        </thead>

{% elseif hueRenderPhase == 'position' and config.displayLineItems %}
    <tr class="line-item">
        <td>{{ lineItem.payload.productNumber }}</td>
        <td>{{ lineItem.label }}</td>
        <td class="align-right">{{ lineItem.quantity }}</td>
        {% if config.displayPrices %}
            <td class="align-right">{% for tax in lineItem.price.taxRules %}{{ tax.taxRate }} %{% endfor %}</td>
            <td class="align-right">{{ lineItem.unitPrice|currency(currencyIsoCode, languageId) }}</td>
            <td class="align-right">{{ lineItem.totalPrice|currency(currencyIsoCode, languageId) }}</td>
        {% endif %}
    </tr>

{% elseif hueRenderPhase == 'shipping' and config.displayLineItems %}
    <tr class="line-item">
        <td></td>
        <td>{{ 'document.lineItems.shippingCosts'|trans }} - {{ order.deliveries.first.shippingMethod.translated.name }}</td>
        <td class="align-right">1</td>
        {% if config.displayPrices %}
            <td class="align-right">{% for tax in order.deliveries.first.shippingCosts.calculatedTaxes %}{{ tax.taxRate }} %{% endfor %}</td>
            <td class="align-right">{{ order.shippingTotal|currency(currencyIsoCode, languageId) }}</td>
            <td class="align-right">{{ order.shippingTotal|currency(currencyIsoCode, languageId) }}</td>
        {% endif %}
    </tr>
{% endif %}
```

> Beachten Sie: Der schließende `</table>`-Tag wird durch die Render-Logik von Shopware ergänzt – im Phasen-Modell gibt jede Phase nur ihren eigenen Abschnitt aus.

### Häufig genutzte Variablen

| Variable                         | Beschreibung                                   |
| -------------------------------- | ---------------------------------------------- |
| `config.displayLineItems`        | Sind Positionen anzuzeigen?                    |
| `config.displayPrices`           | Sind Preise anzuzeigen?                        |
| `config.displayLineItemPosition` | Soll die Positionsnummer angezeigt werden?     |
| `lineItem.label`                 | Bezeichnung der Position                       |
| `lineItem.quantity`              | Menge                                          |
| `lineItem.unitPrice`             | Einzelpreis                                    |
| `lineItem.totalPrice`            | Gesamtpreis der Position                       |
| `lineItem.payload.productNumber` | Produktnummer                                  |
| `lineItem.payload.options`       | Variantenoptionen (Gruppe/Option)              |
| `lineItem.price.taxRules`        | Steuersätze der Position                       |
| `order.shippingTotal`            | Versandkosten                                  |
| `currencyIsoCode`, `languageId`  | Währungs-/Sprach-Kontext für `currency`-Filter |

Eine ausführlichere Übersicht finden Sie unter [Twig-Variablen & Beispiele](/pdf-dokumenten-template-bearbeiten/twig-variablen.md).

## Die Styles der Positionstabelle

Im Feld **„Styles für die Tabelle der Bestellpositionen"** hinterlegen Sie vollständiges CSS (inklusive `<style>`-Tags, je nach geladener Standardvorlage). Dieses CSS wird unverändert (`raw`) in den Dokumentkopf eingefügt und steuert das Aussehen der oben definierten Tabelle.

## Standardvorlagen laden

Beide Felder verfügen über eigene Buttons:

* **Standardvorlage laden** – Lädt das mitgelieferte Standard-Twig-Template der Positionstabelle (passend zur aktuell gewählten Sprache, Deutsch oder Englisch).
* **Standard-Style (CSS) laden** – Lädt das Standard-CSS der Positionstabelle (entspricht dem Shopware-Standardlayout).

> Alle Standardvorlagen zum Nachschlagen und Kopieren finden Sie unter [Template Vorlagen](/pdf-dokumenten-template-bearbeiten/template-vorlagen.md).

> **Tipp:** Wird beim **Lieferschein** das Template geladen, bleibt die Zusammenfassung bewusst leer, da Lieferscheine in der Regel keine Preissummen ausweisen.
