Creazione di una fattura con codice QR (Svizzera)

In questo articolo trovi le istruzioni per creare un modello per generare le fatture con codice QR.

 

Limitazioni:

  • Si possono creare solamente fatture di una pagina.
  • Il codice fornito è solo per il CHF.
  • Il codice di paese per ogni destinatario al di fuori della Svizzera deve essere modificato manualmente all'interno del modello.

Configurazione del modello di documento

  1. Crea una nuova intestazione senza margini. Puoi farlo andando al modulo Configurazione > Comunicazione con il cliente > Documenti di intestazione > Aggiungi un'intestazione
    È importante che tutti i margini siano impostati su 0.
  2. Crea un nuovo modello di documento per le tue fatture (o duplicane uno esistente) nel modulo Configurazioni > Modelli di documento.
  3. Ora aggiungi una sezione a 2 colonne al tuo modello di documento, quindi trascina il bordo centrale verso destra.
  4. Ora trascina tutti i moduli che desideri nella colonna di sinistra e quindi applica i margini a tutti gli altri moduli in base ai margini che desideri effettivamente.
  5. Aggiungi un modulo di testo al di fuori del modulo a 2 sezioni e aggiungi l'HTML che trovi qui sotto.

  6. Aggiungi il CSS che trovi qui sotto alla tua intestazione.

HTML

<table class="qr">
<tbody>
<tr>
<td class="left">
<div class="left-content">
<h3>Récépissé</h3>
<strong>Compte / Payable à</strong><br/>{$company.bank_account|wordwrap:4:' ': true}<br/>{$company.company_name}<br/>{$company.location_street} {$company.location_housenumber}<br/>{$company.location_postalcode}<br/>{$company.location_city} {$company.country}<br/><br/><br/><strong>Payable par</strong><br/>{$f.customer.displayname}<br/>{$f.customer.invoice_street} {$f.customer.invoice_number}<br/>{$f.customer.invoice_postalcode} {$f.customer.invoice_city} <br/>{iff $f.customer.invoice_country != $company.country}{$f.customer.invoice_country}{/iff} <br/>
<table class="currency">
<tbody>
<tr>
<td><strong>Monnaie</strong></td>
<td><strong>Montant</strong></td>
</tr>
<tr>
<td>CHF</td>
<td>{$f.price_invat,noformat|replace:',':' '}</td>
</tr>
</tbody>
</table>
</div>
</td>
<td class="right">
<div class="right-content">
<table class="payment">
<tbody>
<tr>
<td>
<h3>Section de paiement</h3>
<div class="qr-code">
<img src="https://qr-generator.io/?swiss=1&amp;margin=0&amp;cht=qr&amp;chs=543x543&amp;chld=H|0&amp;chl=SPC%0A0200%0A1%0A{$company.bank_account}%0AS%0A{$company.company_name}%0A{$company.location_street}%0A{$company.location_housenumber}%0A{$company.location_postalcode}%0A{$company.location_city}%0ACH%0A%0A%0A%0A%0A%0A%0A%0A{$f.price_invat,noformat|replace:',':''}%0ACHF%0AS%0A{$f.customer.displayname}%0A{$f.customer.invoice_street}%0A{$f.customer.invoice_number}%0A{$f.customer.invoice_postalcode}%0A{$f.customer.invoice_city}%0ACH%0ANON%0A%0A{$f.subject}%0AEPD"/>
</div>
<table class="currency">
<tbody>
<tr>
<td><strong>Monnaie</strong></td>
<td><strong>Montant</strong></td>
</tr>
<tr>
<td>CHF</td>
<td>{$f.price_invat,noformat|replace:',':' '}</td>
</tr>
</tbody>
</table>
</td>
<td><strong>Compte / Payable à</strong><br/>{$company.bank_account|wordwrap:4:' ': true}<br/>{$company.company_name}<br/>{$company.location_street} {$company.location_housenumber}<br/>{$company.location_postalcode}<br/>{$company.location_city} {$company.country}<br/><br/><br/><strong>Payable par</strong><br/>{$f.customer.displayname}<br/>{$f.customer.invoice_street} {$f.customer.invoice_number}<br/>{$f.customer.invoice_postalcode} {$f.customer.invoice_city}<br/>{iff $f.customer.invoice_country != $company.country}{$f.customer.invoice_country}{/iff}</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>

CSS

body > .templatesection table td {
height: 191mm;
}

body > .templatesection table td td {
height: auto;
}

table.qr td {
vertical-align: top;
font-family: Arial;
}

table.qr td.left {
font-size: 8pt;
}

table.qr td.right, table.payment td {
font-size: 10pt;
}

table.qr td.left strong {
font-size: 6pt;
}

table.qr td.right strong {
font-size: 8pt;
}

table.qr td h3 {
font-size: 11pt;
padding-bottom: 12px;
padding-top: 0px;
margin: 0px;
}

table.qr td.left {
width: 62mm;
height: 105mm;
border-top: 0.75pt solid black;
border-right: 0.75pt solid black;
}

.left-content, .right-content {
padding: 5mm;
}

table.qr td.right {
width: 148mm;
height: 105mm;
border-top: 0.75pt solid black;
}

.qr-code {
width: 46mm;
height: 46mm;
margin-top: 5mm;
margin-bottom: 5mm;
}

.qr-code img {
width: 46mm;
height: 46mm;
}
Questo articolo ti è stato utile?
Utenti che ritengono sia utile: 0 su 0