ESC
Ketik untuk mencari…
v2026
Dokumentasi ini masih dalam pengembangan dan mungkin belum sepenuhnya mencerminkan cara kerja aplikasi. Bergabung di forum untuk bertanya dan berbagi masukan →
Docs Pengaturan Template Dokumen

Template Dokumen

Sesuaikan tampilan dokumen yang dicetak dan ditampilkan dengan menulis template HTML sendiri menggunakan bahasa templating Liquid. Ketika sebuah template ditetapkan pada transaksi, Basis merendernya di pratinjau berbasis browser — memberi Anda kendali penuh atas font, warna, dan tata letak dokumen.

Gambaran Umum

Konsep Keterangan
Template File HTML + Liquid yang Anda tulis dan simpan di Pengaturan
Penugasan Setiap transaksi dapat secara opsional merujuk ke satu template
Fallback Jika tidak ada template yang ditetapkan, PDF bawaan digunakan seperti biasa

Membuat Template

  1. Buka Administrasi → Template Dokumen.
  2. Klik Baru.
  3. Masukkan Nama (misalnya "Faktur Modern", "Kwitansi Sederhana").
  4. Klik Mulai dari contoh bawaan untuk mengisi editor dengan template awal yang sesuai dengan tata letak PDF default.
  5. Edit kode HTML/Liquid sesuai kebutuhan.
  6. Klik Simpan.

Editor menerima HTML, CSS, dan tag Liquid standar {{ }} / {% %}. Tidak diperlukan dependensi eksternal — font sistem digunakan secara default.

Menetapkan Template ke Transaksi

Pada form Buat atau Edit transaksi apa pun (Faktur Penjualan, Faktur Pembelian, Pembayaran, Penerimaan, Jurnal, dll.), cari kolom Template Cetak. Pilih template dari dropdown atau biarkan sebagai Bawaan untuk menggunakan PDF default.

Template yang dipilih disimpan bersama transaksi dan digunakan setiap kali dokumen tersebut dibuka pratinjau atau dicetak.

Pratinjau & Cetak

Buka transaksi apa pun dan klik Pratinjau. Jika template ditetapkan:

  • Dokumen dirender di dalam frame browser menggunakan HTML/CSS Anda.
  • Klik Cetak untuk membuka dialog cetak bawaan browser. Gunakan Simpan sebagai PDF dari dialog cetak untuk mengekspor PDF.
  • Aturan CSS @media print { } di dalam template Anda mengontrol tampilan halaman cetak.

Jika tidak ada template yang ditetapkan, viewer QuestPDF bawaan ditampilkan.

Variabel Template

Semua variabel diakses dengan sintaks {{ variabel }}.

Bisnis

Variabel Keterangan
business.name Nama perusahaan
business.address Alamat lengkap
business.logo_url Logo sebagai data URL base64
business.phone Nomor telepon
business.email Alamat email
business.tax_number Nomor NPWP

Dokumen

Variabel Keterangan
document.type Nama jenis dokumen bawaan (misalnya "Faktur Penjualan")
document.custom_title Judul kustom dokumen ini jika diisi (selain itu kosong)
document.title Judul efektif — judul kustom jika diisi, jika tidak document.type. Gunakan ini untuk judul tercetak.
document.number Nomor dokumen (misalnya "SI-2024-0001")
document.date Tanggal, terformat (misalnya "01/06/2026")
document.date_long Tanggal format panjang (misalnya "1 Juni 2026")
document.due_date Tanggal jatuh tempo, terformat
document.due_date_long Tanggal jatuh tempo format panjang
document.reference_number Nomor referensi / nomor faktur pemasok
document.narration Catatan / keterangan
document.currency Kode mata uang (misalnya "IDR")
document.salesman Nama salesman (jika ada)
document.project Nama proyek (jika ada)
document.amount_in_words Grand total dalam huruf (misalnya "Satu Juta Rupiah")

Total Dokumen

Variabel Keterangan
document.subtotal Total sebelum pajak dan diskon
document.total_discount Total diskon
document.total_tax Total pajak
document.total_wht Total PPh (withholding tax)
document.grand_total Jumlah akhir yang harus dibayar

Pihak (Pelanggan / Pemasok)

Variabel Keterangan
document.party.name Nama pihak
document.party.address Alamat lengkap
document.party.tax_number NPWP pihak
document.party.phone Nomor telepon pihak

Baris Item

Iterasi dengan {% for item in document.items %} ... {% endfor %}.

Variabel Keterangan
item.line_number Nomor baris (mulai dari 1)
item.item_code Kode barang
item.item_name Nama barang
item.item_description Deskripsi opsional
item.quantity Jumlah
item.unit Satuan
item.unit_price Harga satuan
item.discount_percent Persentase diskon
item.discount_amount Nominal diskon
item.line_subtotal Jumlah baris sebelum pajak
item.tax_name Nama kategori pajak
item.tax_rate Tarif pajak (%)
item.tax_amount Nominal pajak untuk baris ini
item.amount Total baris (setelah pajak)

Label (Multibahasa)

Gunakan {{ labels.* }} untuk menampilkan teks yang secara otomatis menyesuaikan dengan bahasa aktif aplikasi (Bahasa Indonesia atau Inggris).

Variabel Bahasa Indonesia Bahasa Inggris
labels.bill_to TAGIHAN KEPADA BILL TO
labels.date Tanggal Date
labels.due_date Jatuh Tempo Due Date
labels.reference Referensi Reference
labels.salesman Salesman Salesman
labels.no No. No.
labels.description Keterangan Description
labels.qty Jumlah Qty
labels.unit_price Harga Satuan Unit Price
labels.line_amount Jumlah Amount
labels.tax Pajak Tax
labels.total Total Total
labels.subtotal Subtotal Subtotal
labels.total_discount Diskon Discount
labels.total_tax Pajak Tax
labels.grand_total Grand Total Grand Total
labels.amount_in_words Terbilang Amount in Words
labels.notes Catatan / Syarat Notes / Terms
labels.received_by Diakui Pelanggan Received by
labels.approved_by Disetujui oleh Approved by
labels.prepared_by Dibuat oleh Prepared by
labels.page Halaman Page

Filter

Filter Contoh Hasil
money {{ 1500000 \| money }} 1.500.000,00 (ID) / 1,500,000.00 (EN)
date {{ document.date \| date: "dd/MM/yyyy" }} 01/06/2026
upcase {{ document.type \| upcase }} FAKTUR PENJUALAN
downcase {{ "Halo" \| downcase }} halo

Tips: Gunakan {{ document.date_long }} dan {{ document.due_date_long }} langsung — keduanya sudah diformat sesuai bahasa aktif tanpa perlu filter tambahan.

Blok Kondisional

{% if business.logo_url %}
  <img src="{{ business.logo_url }}" alt="Logo">
{% else %}
  <strong>{{ business.name }}</strong>
{% endif %}

{% if document.total_discount > 0 %}
  <tr><td>Diskon</td><td>{{ document.total_discount | money }}</td></tr>
{% endif %}

Tips

  • Tata letak cetak: Tambahkan @media print { body { padding: 10mm 12mm; } } ke CSS Anda untuk margin cetak yang tepat. Gunakan @media screen { body { padding: 12mm; } } untuk pratinjau di layar.
  • Ukuran halaman: Frame pratinjau memiliki lebar 794 px (A4 potret). Desain untuk lebar ini.
  • Font sistem: Gunakan 'Segoe UI', system-ui, -apple-system, Arial, sans-serif — tidak perlu mengimpor font eksternal.
  • Beberapa template: Buat template terpisah untuk gaya dokumen berbeda (misalnya formal vs. sederhana) dan tetapkan yang sesuai per transaksi.
  • Fallback: Menghapus template tidak merusak transaksi yang sudah ada — secara otomatis akan kembali ke PDF bawaan.

Terkait