LiquidPDF
Angebot als Entwurf markiert
Die Vorlage weiß nichts von der Markierung: post.watermark legt DRAFT nach dem Rendern über jede Seite, geprüfter Entwurf und endgültiges Angebot kommen also aus derselben Vorlage und denselben Daten. Der Text richtet sich nach der Seitendiagonale und läuft von links unten nach rechts oben. Eine halbe Einheit zusätzlich zum Rendering; /pdf/watermark markiert ein früher gerendertes PDF.
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
- Die Vorlage enthält kein Wasserzeichen:
post.watermarklegt den Text nach dem Rendern über jede Seite, und ohne die Angabe entsteht das saubere Angebot. - Der Text richtet sich nach der Seitendiagonale und läuft von links unten nach rechts oben;
color,opacityundrotationändern das. - Liquid übergibt Helfer-Argumente nach einem Doppelpunkt:
dateAdd: 30, "days"setzt die Gültigkeit, undmoneygibt Pfund aus, weil die Währung der VorlageGBPist. - Ein früher gerendertes PDF wird über
/pdf/watermarkmarkiert, ohne es erneut zu rendern. - Post-Processing gehört zum Starter-Plan und darüber, auch mit einem Test-Schlüssel; mit einem Live-Schlüssel kostet jeder Schritt eine halbe Einheit zusätzlich zum Rendering.
Verwendete Helfer
Vorlagenordner
<header>
<p class="brand">{{ company.name }}</p>
<p class="muted">{{ company.street }} · {{ company.city }}</p>
</header>
<h1>Quote {{ quote.number }}</h1>
<p class="muted">
For {{ customer.name }} · issued {{ quote.date | date: "d MMMM yyyy" }} ·
valid until {{ quote.date | dateAdd: 30, "days" | date: "d MMMM yyyy" }}
</p>
<table>
<thead>
<tr><th>Item</th><th class="num">Qty</th><th class="num">Rate</th><th class="num">Amount</th></tr>
</thead>
<tbody>
{% for line in quote.lines %}
<tr>
<td>{{ line.description }}</td>
<td class="num">{{ line.qty }}</td>
<td class="num">{{ line.price | money }}</td>
<td class="num">{{ line.total | money }}</td>
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr><td colspan="3">Total</td><td class="num">{{ quote.lines | sum: "total" | money }}</td></tr>
</tfoot>
</table>
<p class="notes">{{ quote.notes }}</p>body { font-family: 'Inter', sans-serif; font-size: 10pt; color: #1e293b; }
header { padding-bottom: 6mm; border-bottom: 1px solid #e2e8f0; }
.brand { margin: 0; font-size: 14pt; font-weight: 700; color: #0f766e; }
.muted { margin: 1mm 0 0; color: #64748b; }
h1 { margin: 14mm 0 2mm; font-size: 22pt; }
table { width: 100%; margin-top: 10mm; border-collapse: collapse; }
th { padding: 2mm 1.5mm; border-bottom: 1.5px solid #1e293b; text-align: left; font-size: 8pt; text-transform: uppercase; color: #64748b; }
td { padding: 2.5mm 1.5mm; border-bottom: 1px solid #e2e8f0; }
tfoot td { border-top: 1.5px solid #1e293b; border-bottom: 0; font-weight: 700; font-size: 12pt; }
.num { text-align: right !important; white-space: nowrap; }
.notes { margin-top: 10mm; font-size: 8.5pt; color: #64748b; }<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap">{
"pdf": {
"metadata": {
"title": "Quote {{ quote.number }}"
}
},
"paper": {
"format": "A4"
},
"margin": {
"top": "22mm",
"right": "20mm",
"bottom": "22mm",
"left": "20mm"
},
"locale": "en-GB",
"currency": "GBP"
}{
"company": {
"name": "Fennlor Studio Ltd",
"street": "1 Example Street",
"city": "Exampletown"
},
"customer": {
"name": "Olvarest Ltd"
},
"quote": {
"number": "Q-2026-017",
"date": "2026-09-10",
"lines": [
{
"description": "Discovery workshop",
"qty": 2,
"price": 950,
"total": 1900
},
{
"description": "Design system",
"qty": 1,
"price": 6400,
"total": 6400
},
{
"description": "Front-end build (days)",
"qty": 12,
"price": 720,
"total": 8640
}
],
"notes": "Prices exclude VAT. Travel is billed at cost."
}
}Ü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. Post-Processing setzt den Starter-Plan oder höher voraus: Der Free-Plan antwortet mit 403, auch bei einem Test-Schlüssel. Renderings mit einem Schlüssel, der mit ff_test_ beginnt, werden nicht gezählt.
jq '{template: "quote", data: ., post: {watermark: {text: "DRAFT"}}}' data.json \
| curl https://api-eu.formfeed.dev/v1/renders \
-H "Authorization: Bearer ff_live_..." \
-H "Content-Type: application/json" \
--data-binary @-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: 'quote',
data,
post: {
watermark: { text: 'DRAFT' },
},
});
console.log(render.status, render.download_url);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="quote",
data=data,
post={
"watermark": {"text": "DRAFT"},
},
)
print(render.status, render.download_url)<?php
$body = [
'template' => 'quote',
'data' => json_decode(file_get_contents('data.json'), true),
'post' => [
'watermark' => ['text' => 'DRAFT'],
],
];
$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;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": "quote",
"data": json.RawMessage(data),
"post": map[string]any{
"watermark": map[string]any{"text": "DRAFT"},
},
})
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)
}using System.Net.Http.Headers;
using System.Net.Http.Json;
using System.Text.Json;
var body = new
{
template = "quote",
data = JsonDocument.Parse(File.ReadAllText("data.json")).RootElement,
post = new {
watermark = new { text = "DRAFT" },
},
};
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")}");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": "quote",
"post": {"watermark":{"text":"DRAFT"}},
"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 …
}
}require "json"
require "net/http"
body = {
template: "quote",
data: JSON.parse(File.read("data.json")),
post: {
watermark: { text: "DRAFT" },
},
}
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"]Weitere Aufrufe
// mark a PDF you already rendered, without rendering it again
const marked = await formfeed.pdf.watermark(render, {
text: 'SUPERSEDED',
color: '#b91c1c',
opacity: 0.15,
});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.
