Jinja2PDF

Packliste, nach Packstücken gruppiert

Die Anfrage sendet eine flache Artikelliste; groupBy macht daraus einen Abschnitt je Packstück mit eigener Tabelle und eigenem Gewicht, und die Einleitung zählt Packstücke, Artikel und Kilogramm. Ein Packstück wird nie über zwei Seiten getrennt.

Diese Vorlage verwenden Die Anfrage in acht Sprachen ↓

Kostenloser Plan, keine Kreditkarte. Sie erhalten eine eigene Kopie im Editor, veröffentlicht und bereit für die API.

Gerendertes Ergebnis

Was dieses Beispiel zeigt

shipment.items | groupBy('package') liefert eine Liste aus { key, items }; der Aufrufer sendet die Artikel also so, wie sie aus der Lagerverwaltung kommen, und die Vorlage baut die Abschnitte.
Jeder Abschnitt summiert sein Gewicht mit package.items | sum('weight_kg'); die Einleitung summiert die ganze Liste: 3 Packstücke, 44 Artikel, 19,6 kg.
number(1) gibt eine Nachkommastelle mit deutschem Komma aus, weil die Locale de-DE ist.
.package { break-inside: avoid } hält ein Packstück samt Tabelle auf einer Seite, wenn die Liste wächst.

Verwendete Helfer

Vorlagenordner

template.html

templates/packliste/template.htmlJinja2

<p class="sender">{{ company.name }} · {{ company.street }} · {{ company.city }}</p>
<address class="recipient">
  <strong>{{ customer.name }}</strong><br>
  {{ customer.street }}<br>
  {{ customer.city }}
</address>
<table class="facts">
  <tr><td>Packliste</td><td>{{ shipment.number }}</td></tr>
  <tr><td>Datum</td><td>{{ shipment.date | date('dd.MM.yyyy') }}</td></tr>
  <tr><td>Bestellung</td><td>{{ shipment.order_number }}</td></tr>
</table>

<h1>Packliste {{ shipment.number }}</h1>
{% set packages = shipment.items | groupBy('package') %}
<p>{{ packages | length }} Packstücke, {{ shipment.items | sum('qty') | number(0) }} Artikel, {{ shipment.items | sum('weight_kg') | number(1) }} kg gesamt.</p>

{% for package in packages %}
<section class="package">
  <h2>Packstück {{ package.key }} <span class="muted">· {{ package.items | sum('weight_kg') | number(1) }} kg</span></h2>
  <table class="lines">
    <thead><tr><th>Artikelnr.</th><th>Bezeichnung</th><th class="num">Menge</th><th class="num">Gewicht</th></tr></thead>
    <tbody>
      {% for item in package.items %}
      <tr>
        <td>{{ item.sku }}</td>
        <td>{{ item.description }}</td>
        <td class="num">{{ item.qty | number(0) }}</td>
        <td class="num">{{ item.weight_kg | number(1) }} kg</td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</section>
{% endfor %}

style.css

templates/packliste/style.cssCSS

body { font-family: 'Inter', sans-serif; font-size: 9.5pt; line-height: 1.45; color: #1e293b; }
.sender {
  display: inline-block;
  margin: 10mm 0 3mm;
  padding-bottom: 1mm;
  border-bottom: 1px solid #cbd5e1;
  font-size: 7pt;
  color: #64748b;
}
.recipient { min-height: 27mm; font-style: normal; line-height: 1.5; }
.facts { float: right; margin-top: -27mm; font-size: 8.5pt; color: #475569; }
.facts td { padding: 0.4mm 0 0.4mm 5mm; }
.facts td:last-child { text-align: right; color: #1e293b; }
h1 { clear: both; margin: 14mm 0 4mm; font-size: 16pt; color: #312e81; }
table.lines { width: 100%; margin-top: 6mm; border-collapse: collapse; }
.lines th {
  padding: 2mm 1.5mm;
  border-bottom: 1.5px solid #1e293b;
  text-align: left;
  font-size: 7.5pt;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #64748b;
}
.lines td { padding: 2.3mm 1.5mm; border-bottom: 1px solid #e2e8f0; vertical-align: top; }
.lines tr { break-inside: avoid; }
.num { text-align: right !important; white-space: nowrap; }
.totals { width: 78mm; margin: 5mm 0 0 auto; border-collapse: collapse; }
.totals td { padding: 1.2mm 1.5mm; }
.totals .grand td { border-top: 1.5px solid #1e293b; font-weight: 700; font-size: 11pt; }
.muted { color: #64748b; }
.package { margin-top: 8mm; break-inside: avoid; }
h2 { margin: 0; font-size: 11pt; }
.package table.lines { margin-top: 2mm; }

head.html

templates/packliste/head.htmlHTML

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap">

footer.html

templates/packliste/footer.htmlJinja2

<div style="box-sizing:border-box;width:100%;display:flex;justify-content:space-between;gap:6mm;padding:0 18mm;font-size:7px;line-height:1.5;color:#555">
  <span>{{ company.name }} · {{ company.street }} · {{ company.city }}<br>{{ company.register }} · Geschäftsführung: {{ company.director }}</span>
  <span>USt-IdNr. {{ company.vat_id }}<br>IBAN {{ company.iban }} · BIC {{ company.bic }}</span>
  <span style="white-space:nowrap">Seite <span class="pageNumber"></span> von <span class="totalPages"></span></span>
</div>

settings.json

templates/packliste/settings.jsonJSON

{
  "paper": {
    "format": "A4"
  },
  "margin": {
    "top": "20mm",
    "right": "18mm",
    "bottom": "26mm",
    "left": "22mm"
  },
  "locale": "de-DE",
  "timezone": "Europe/Berlin",
  "currency": "EUR",
  "pdf": {
    "metadata": {
      "title": "Packliste {{ shipment.number }}"
    }
  },
  "footer": {
    "height": "16mm"
  }
}

data.json

templates/packliste/data/default.jsonJSON

{
  "company": {
    "name": "Fennlor Studio GmbH",
    "street": "Musterstraße 1",
    "city": "12345 Musterstadt",
    "phone": "+49 000 0000000",
    "email": "hallo@fennlor.example",
    "iban": "DE36000000000000000000",
    "bic": "XXXXDEXXXXX",
    "vat_id": "DE000000000",
    "register": "Amtsgericht Musterstadt, HRB 00000",
    "director": "Erika Mustermann"
  },
  "customer": {
    "name": "Olvarest GmbH",
    "contact": "Max Mustermann",
    "street": "Beispielweg 2",
    "city": "54321 Beispielstadt",
    "number": "K-10482"
  },
  "shipment": {
    "number": "PL-2026-0117",
    "date": "2026-09-16",
    "order_number": "B-4471",
    "items": [
      {
        "package": "1 von 3",
        "sku": "FF-1001",
        "description": "Tischleuchte, schwarz",
        "qty": 6,
        "weight_kg": 7.2
      },
      {
        "package": "1 von 3",
        "sku": "FF-3300",
        "description": "Leuchtmittel E27, warmweiß",
        "qty": 12,
        "weight_kg": 0.9
      },
      {
        "package": "2 von 3",
        "sku": "FF-1001",
        "description": "Tischleuchte, schwarz",
        "qty": 6,
        "weight_kg": 7.2
      },
      {
        "package": "2 von 3",
        "sku": "FF-3300",
        "description": "Leuchtmittel E27, warmweiß",
        "qty": 12,
        "weight_kg": 0.9
      },
      {
        "package": "3 von 3",
        "sku": "FF-2040",
        "description": "Leinenschirm, natur",
        "qty": 8,
        "weight_kg": 3.4
      }
    ]
  }
}

Über die API rendern

Speichern Sie die Beispieldaten als data.json und senden Sie sie mit dem Namen der Vorlage. TypeScript und Python nutzen die SDKs; jede andere Sprache schickt dasselbe JSON mit ihrer Standardbibliothek an die REST-API. Renderings mit einem Schlüssel, der mit ff_test_ beginnt, werden nicht gezählt; im Free-Tarif tragen sie ein kleines Wasserzeichen.

curl

render.shShell

jq '{template: "packliste", data: ., filename: "packliste-PL-2026-0117.pdf"}' data.json \
  | curl https://api-eu.formfeed.dev/v1/renders \
      -H "Authorization: Bearer ff_test_..." \
      -H "Content-Type: application/json" \
      --data-binary @-

TypeScript

render.tsTypeScript

import { Formfeed } from '@formfeed/sdk';
import data from './data.json' with { type: 'json' };

const formfeed = new Formfeed({ apiKey: process.env.FORMFEED_API_KEY! });

const render = await formfeed.renders.create({
  template: 'packliste',
  data,
  filename: 'packliste-PL-2026-0117.pdf',
});
console.log(render.status, render.download_url);

Python

render.pyPython

import json
import os

from formfeed import Formfeed

formfeed = Formfeed(api_key=os.environ["FORMFEED_API_KEY"])

with open("data.json", encoding="utf-8") as file:
    data = json.load(file)

render = formfeed.renders.create(
    template="packliste",
    data=data,
    filename="packliste-PL-2026-0117.pdf",
)
print(render.status, render.download_url)

PHP

render.phpPHP

<?php
$body = [
    'template' => 'packliste',
    'data' => json_decode(file_get_contents('data.json'), true),
    'filename' => 'packliste-PL-2026-0117.pdf',
];

$curl = curl_init('https://api-eu.formfeed.dev/v1/renders');
curl_setopt_array($curl, [
    CURLOPT_POST => true,
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_HTTPHEADER => [
        'Authorization: Bearer ' . getenv('FORMFEED_API_KEY'),
        'Content-Type: application/json',
    ],
    CURLOPT_POSTFIELDS => json_encode($body),
]);
$render = json_decode(curl_exec($curl), true);

echo $render['status'], ' ', $render['download_url'], PHP_EOL;

main.goGo

package main

import (
	"bytes"
	"encoding/json"
	"fmt"
	"net/http"
	"os"
)

func main() {
	data, err := os.ReadFile("data.json")
	if err != nil {
		panic(err)
	}
	body, _ := json.Marshal(map[string]any{
		"template": "packliste",
		"data":     json.RawMessage(data),
		"filename": "packliste-PL-2026-0117.pdf",
	})

	request, _ := http.NewRequest("POST", "https://api-eu.formfeed.dev/v1/renders", bytes.NewReader(body))
	request.Header.Set("Authorization", "Bearer "+os.Getenv("FORMFEED_API_KEY"))
	request.Header.Set("Content-Type", "application/json")

	response, err := http.DefaultClient.Do(request)
	if err != nil {
		panic(err)
	}
	defer response.Body.Close()

	var render struct {
		Status      string `json:"status"`
		DownloadURL string `json:"download_url"`
	}
	json.NewDecoder(response.Body).Decode(&render)
	fmt.Println(render.Status, render.DownloadURL)
}

Program.csC#

using System.Net.Http.Headers;
using System.Net.Http.Json;
using System.Text.Json;

var body = new
{
    template = "packliste",
    data = JsonDocument.Parse(File.ReadAllText("data.json")).RootElement,
    filename = "packliste-PL-2026-0117.pdf",
};

using var http = new HttpClient();
http.DefaultRequestHeaders.Authorization =
    new AuthenticationHeaderValue("Bearer", Environment.GetEnvironmentVariable("FORMFEED_API_KEY"));

var response = await http.PostAsJsonAsync("https://api-eu.formfeed.dev/v1/renders", body);
var render = await response.Content.ReadFromJsonAsync<JsonElement>();

Console.WriteLine($"{render.GetProperty("status")} {render.GetProperty("download_url")}");

Java

Render.javaJava

import java.net.URI;
import java.net.http.HttpClient;
import java.net.http.HttpRequest;
import java.net.http.HttpResponse;
import java.nio.file.Files;
import java.nio.file.Path;

public class Render {
  public static void main(String[] args) throws Exception {
    String data = Files.readString(Path.of("data.json"));
    String body = """
        {
          "template": "packliste",
          "filename": "packliste-PL-2026-0117.pdf",
          "data": %s
        }
        """.formatted(data);

    HttpRequest request = HttpRequest.newBuilder(URI.create("https://api-eu.formfeed.dev/v1/renders"))
        .header("Authorization", "Bearer " + System.getenv("FORMFEED_API_KEY"))
        .header("Content-Type", "application/json")
        .POST(HttpRequest.BodyPublishers.ofString(body))
        .build();

    HttpResponse<String> response = HttpClient.newHttpClient().send(request, HttpResponse.BodyHandlers.ofString());
    System.out.println(response.body()); // status, download_url, page_count, units …
  }
}

Ruby

render.rbRuby

require "json"
require "net/http"

body = {
  template: "packliste",
  data: JSON.parse(File.read("data.json")),
  filename: "packliste-PL-2026-0117.pdf",
}

response = Net::HTTP.post(
  URI("https://api-eu.formfeed.dev/v1/renders"),
  JSON.generate(body),
  "Authorization" => "Bearer #{ENV.fetch("FORMFEED_API_KEY")}",
  "Content-Type" => "application/json"
)
render = JSON.parse(response.body)

puts render["status"], render["download_url"]

Heute mit dem Rendern beginnen

Der kostenlose Plan enthält 100 Einheiten im Monat und kostenlose Testrenderings. Wechseln Sie den Plan, wenn Sie mehr brauchen.

Diese Vorlage verwenden Dokumentation lesen