Angebotsvorlage erstellen

Erstellen Sie Ihre Angebotsvorlage mit dem Drag-and-Drop-Editor. Erfahren Sie, wie Sie Blöcke hinzufügen, Variablen verwenden und Ihre Vorlage professionell gestalten.

Dokumentvorlagen bestimmen, wie Ihre Angebote, Rechnungen und Arbeitsscheine aussehen. Ihre Angebotsvorlage ist die Visitenkarte Ihres Unternehmens - jeder Kunde, der ein Angebot erhält, sieht Ihre Vorlage.

Bas verwendet einen Drag-and-Drop-Editor, mit dem Sie ohne technische Kenntnisse professionelle Vorlagen erstellen. Sie ziehen Blöcke in Ihr Dokument, füllen Variablen aus (wie Kundenname oder Angebotsnummer) und passen die Gestaltung an Ihr Corporate Design an.


Schritt 1 - Vorlagen öffnen

Gehen Sie zu Einstellungen > Arbeitsweise > Dokumentvorlagen. Sie sehen eine Übersicht aller verfügbaren Vorlagen. Klicken Sie auf die Angebotsvorlage und anschließend auf das Stift-Symbol, um den Editor zu öffnen.


Schritt 2 - Den Editor verstehen

Der Editor besteht aus drei Teilen:

Bestandteil

Funktion

Canvas (Mitte)

Hier bauen Sie Ihre Vorlage auf, indem Sie Blöcke ziehen

Blöcke (rechts)

Alle verfügbaren Bausteine für Ihr Dokument

Einstellungen (rechts)

Gestaltung der ausgewählten Blöcke anpassen

Desktop- und Mobilansicht

Oben im Editor wechseln Sie zwischen Desktop- und Mobilansicht. Die meisten Kunden sehen sich Angebote am Desktop an, aber prüfen Sie immer, ob die mobile Version gut aussieht.


Schritt 3 - Blöcke hinzufügen

Ziehen Sie Blöcke aus dem rechten Menü auf Ihr Canvas. Die wichtigsten Blöcke:

Standardblöcke

Block

Verwendung

SPALTEN

Teilen Sie Ihre Seite in mehrere Spalten auf (z. B. Logo links, Firmendaten rechts)

RUBRIK

Überschriften und Zwischenüberschriften

ABSATZ

Fließtext, wie Ihr Angebotstext

BILD

Ihr Logo oder andere Bilder

BUTTON

Schaltflächen (z. B. "Online ansehen" oder "Angebot akzeptieren")

TRENNLINIE

Trennlinien zwischen Abschnitten

TABELLE

Manuelle Tabellen (verwenden Sie dies NICHT für Angebotspositionen, dafür gibt es einen speziellen Block)

HTML

Für fortgeschrittene Nutzer: individueller HTML-Code

Spezielle Blöcke für Angebote

Block

Verwendung

ANGEBOTSPOSITIONEN

Zeigt automatisch alle Angebotspositionen aus dem Vorgang an (Beschreibung, Anzahl, Betrag, Gesamtsumme, MwSt.)

RECHNUNGSPOSITIONEN

Zeigt automatisch alle Rechnungspositionen an (verwenden Sie dies in Ihrer Rechnungsvorlage)

ANGEBOT STUNDENSATZ

Zeigt Stundensatz-Informationen aus dem Angebot an

Achtung: Verwenden Sie für Ihre Preistabelle immer den Block ANGEBOTSPOSITIONEN. NIEMALS eine manuelle Tabelle. Der Block ANGEBOTSPOSITIONEN holt die Daten automatisch aus dem Vorgang und hält alles synchron.


Schritt 4 - Variablen verwenden

Variablen sind dynamische Felder, die automatisch mit Daten aus dem Vorgang gefüllt werden. Denken Sie an den Kundennamen, die Adresse oder die Angebotsnummer.

Variablen einfügen

  1. Klicken Sie in einen Textblock, in dem Sie eine Variable platzieren möchten

  2. Klicken Sie in der Symbolleiste auf Variablen (Dropdown-Schaltfläche)

  3. Wählen Sie eine Kategorie (Identität, Kunde, Angebot oder Umzug)

  4. Wählen Sie die Variable aus

Die Variable erscheint als ####{{ quote.loadAddresses|trans }} in Ihrem Text. Diese wird automatisch durch den tatsächlichen Wert ersetzt, wenn das Angebot erstellt wird.

Verfügbare Variablen

Identität (Ihre Firmendaten): - Adresse - Firmenname - BTW-Nummer - E-Mail - IBAN - KvK-Nummer - Logo - Mobilnummer - Telefonnummer

Kunde (Kundendaten): - Anrede - Nachname - Firmenname - BTW-Nummer - E-Mail - Rechnungsansprechpartner - Rechnungsadresse (mit Untervariablen) - Hauptansprechpartner (mit Untervariablen) - Kundennummer

Angebot: - Angebotsnummer - Referenz - Gesamtbetrag inkl. BTW - Ablaufdatum - Freitextfelder

Umzug: - Vorgangsnummer - Datum des ersten Umzugstermins - Uhrzeit des ersten Umzugstermins - Ladeadresse (mit Untervariablen) - Datum des letzten Umzugstermins - Uhrzeit des letzten Umzugstermins - Entladeadresse (mit Untervariablen) - Notizen für den Kunden

Tipp: Die Variablennamen sind im Editor auf Englisch, aber die AUSGABE erfolgt auf Niederländisch. ####{{ quote.loadAddresses|trans }} zeigt im generierten PDF "Laadadres: Voorbeeldstraat 10, 1234 AB Amsterdam" an.


Schritt 5 - Gestaltung anpassen

Wählen Sie einen Block aus, um die Einstellungen anzupassen. Sie können Folgendes ändern:

Textgestaltung

  • Schriftart und -größe

  • Fett, kursiv, unterstrichen

  • Textfarbe

  • Ausrichtung (links, mittig, rechts)

Farben

  • Hintergrundfarbe von Blöcken

  • Textfarbe

  • Rahmenfarbe

Abstand und Raum

  • Padding (Innenabstand rund um den Text)

  • Margin (Außenabstand zwischen Blöcken)

  • Containerraum (Breite des Blocks)

Bilder

  • Laden Sie Ihr Logo hoch

  • Passen Sie die Größe an

  • Legen Sie die Ausrichtung fest

  • Fügen Sie einen Link hinzu (optional)

Achtung: Verwenden Sie für Ihr Logo vorzugsweise eine SVG-Datei (Vektordatei) oder eine PNG-Datei mit transparentem Hintergrund von mindestens 300x300 Pixeln. SVG bleibt beim Drucken scharf und skaliert perfekt.


Schritt 6 - Positionen konfigurieren

Der Block ANGEBOTSPOSITIONEN verfügt über besondere Optionen:

Anzeige der Positionen

Im rechten Bedienfeld stellen Sie ein: - Summen pro Position immer ausblenden: Blenden Sie die Summenspalte pro Position ein oder aus - Anzahl immer ausblenden: Blenden Sie die Anzahlspalte ein oder aus

Optionale Positionen

Manche Angebotspositionen können als Optional gekennzeichnet werden. Das bedeutet, dass der Kunde beim Online-Angebot diese Position an- oder abhaken kann. Das ist praktisch für Upselling (z. B. "Demontage/Montage pro Stunde - Optional").

Tipp: Optionale Positionen erhöhen Ihre Chance auf Upselling. Der Kunde sieht sofort, was zusätzliche Leistungen kosten, und kann sie selbst auswählen.


Schritt 7 - Vorlage speichern und testen

Nach der Bearbeitung:

  1. Klicken Sie auf Speichern

  2. Gehen Sie zu einem Test-Vorgang (oder legen Sie einen mit fiktiven Daten an)

  3. Erstellen Sie ein Angebot für diesen Vorgang

  4. Sehen Sie sich die PDF-Vorschau an

Prüfen Sie bei der Vorschau

  • Sind alle Variablen korrekt ausgefüllt? (kein ####{{ quote.something }} sichtbar)

  • Stimmt die Gestaltung auf Seite 2 und weiteren Seiten?

  • Werden die ANGEBOTSPOSITIONEN sauber dargestellt?

  • Stimmen Logogröße und -position?

  • Entsprechen die Farben Ihrem Corporate Design?

  • Gibt es keine unerwünschten Leerräume?

Achtung: Der Editor zeigt Beispieldaten ("Jan Jansen", "Voorbeeldstraat 1"). Dies sind Dummy-Daten. Bei einem echten Vorgang werden diese automatisch durch die tatsächlichen Kundendaten ersetzt.


Kopf- und Fußzeilen

Die Kopfzeile (Header) und Fußzeile (Footer) Ihrer Vorlage erscheinen auf jeder Seite. Hier stehen häufig Ihr Logo, Ihre Firmendaten, KvK-Nummer, BTW-Nummer und IBAN.

Sie können selbst eine einfache Kopfzeile erstellen, indem Sie oben in Ihrer Vorlage einen SPALTEN-Block mit Ihrem Logo und Ihren Firmendaten hinzufügen. Für komplexere Kopfzeilen (z. B. mit SVG-Elementen oder aufwendiger Gestaltung) können Sie bei Bedarf während des Onboardings um Hilfe bitten.

Was gehört in die Kopf-/Fußzeile?

Bestandteil

Kopfzeile

Fußzeile

Logo

Ja

Nein

Firmenname

Ja

Ja

Adresse

Nein

Ja

Telefon / E-Mail

Ja

Ja

KvK-Nummer

Nein

Ja

BTW-Nummer

Nein

Ja

IBAN

NIEMALS auf dem Angebot

Nur auf der Rechnung

Achtung: Setzen Sie Ihre IBAN nicht auf das Angebot. Wenn die IBAN auf dem Angebot steht, zahlen Kunden manchmal direkt aufgrund des Angebots, anstatt auf die Rechnung zu warten. Das führt zu administrativem Mehraufwand. Geben Sie die IBAN nur auf Ihrer Rechnungsvorlage an.


Vorlage kopieren

Möchten Sie eine neue Vorlage erstellen, die einer bestehenden ähnelt? Verwenden Sie beim Anlegen einer neuen Vorlage die Funktion "Basierend auf". Damit kopieren Sie die Gestaltung, Struktur und den Stil. Sie müssen dann nur noch die Texte anpassen.

Das ist praktisch für: - Eine separate Angebotsvorlage für Firmenumzüge - Eine englischsprachige Version - Eine Vorlage für spezifische Dienstleistungen (z. B. Einlagerung)


Online-Angebot vs. PDF

Das Angebot, das Ihr Kunde erhält, kann auf zwei Arten angesehen werden:

Ansicht

Wie es funktioniert

Online-Angebot

Der Kunde öffnet das Angebot über einen Link in der E-Mail. Dies ist ein durchgehender One-Pager ohne Seitenaufteilung. Hier kann der Kunde optionale Positionen an-/abwählen.

PDF-Angebot

Das Angebot als herunterladbare PDF-Datei mit festen A4-Seiten.

Achtung: Eine Gestaltung, die in der Online-Ansicht gut aussieht, kann im PDF an einer ungünstigen Stelle umbrechen (z. B. eine Tabelle, die auf halber Höhe über zwei Seiten aufgeteilt wird). Testen Sie daher immer beide Ansichten.


Ablaufdatum des Angebots

Bei jedem Angebot legen Sie ein Ablaufdatum fest. Das ist das Datum, bis zu dem das Angebot gültig ist.

Tipp: Legen Sie das Ablaufdatum kurz fest, zum Beispiel 1 Woche. Ein kurzes Ablaufdatum erhöht Ihre Erfolgsquote: Kunden spüren Dringlichkeit und reagieren schneller. Der Kunde kann übrigens auch nach Ablauf des Datums noch unterschreiben - das System blockiert dies nicht. Das Ablaufdatum wirkt als psychologischer Nudge.


Tipps

  • Verwenden Sie den Block ANGEBOTSPOSITIONEN für Ihre Preistabelle. NIEMALS eine manuelle Tabelle - diese bleibt nicht synchron mit Ihrem Vorgang.

  • Testen Sie mit einem realen Szenario. Legen Sie einen Test-Vorgang mit mehreren Angebotspositionen an und sehen Sie sich das PDF an.

  • Liefern Sie Ihr Logo als SVG. Das ergibt die schärfsten Resultate im PDF.

  • Halten Sie Ihre Texte kurz. Kunden lesen keine drei Seiten. Verweisen Sie auf Ihre Allgemeinen Geschäftsbedingungen.

  • Vorschau auf mehreren Seiten. Erstellen Sie ein langes Testangebot und prüfen Sie, ob Seite 2 und 3 gut aussehen.

  • Dummy-Daten sind normal. Der Editor zeigt Beispieldaten. Diese werden bei echter Nutzung automatisch ersetzt.

  • Verwenden Sie optionale Positionen für Upselling. Kunden können Leistungen selbst hinzufügen oder abwählen.

  • Legen Sie ein kurzes Ablaufdatum fest. Eine Woche funktioniert besser als ein Monat.


Achtung

  • Der Block ANGEBOTSPOSITIONEN ist verpflichtend. Manuelle Tabellen geraten out-of-sync mit Ihrem Vorgang.

  • Variablen haben englische Namen im Editor, zeigen aber niederländischen Text in der Ausgabe.

  • Testen Sie immer, bevor Sie live gehen. Erstellen Sie ein Testangebot und sehen Sie sich das PDF an.

  • Online und PDF können sich unterscheiden. Testen Sie beide Ansichten - Seitenumbrüche fallen manchmal anders aus.

  • Logo als PNG verschwindet manchmal ab Seite 2. Verwenden Sie SVG für eine zuverlässige Darstellung auf allen Seiten.


Nächster Schritt: Variablen in Vorlagen verwenden

Hat dies Ihre Frage beantwortet?