How do I customize my invoice or quote templates?
How do I make custom fields appear on my invoices or quotes?
My logo appears blurry or pixelated on the PDF. How can I improve this?
FusionInvoice comes with a copy of the default template placed in the custom templates folder out of the box. This provides you with a convenient way to start customizing your invoice layout should you wish to. All custom templates should be placed in either custom/templates/invoice_templates or custom/templates/quote_templates.
Copies of the default templates are available at the following locations to use as starting points:
custom/templates/invoice_templates/custom.blade.php custom/templates/quote_templates/custom.blade.php
A few notes about templates:
Custom fields won't display by default on the PDF output. However, they can easily be added to the invoice or quote template PDF output by customizing the template.
Once a custom field has been created for an invoice, take note of the value in the "Column Name" column. The system will name these "column_1", "column_2", etc.
In the examples below, you'll replace column_1 with the column number for your custom field.
Adding a custom invoice field to an invoice:
{{ $invoice->custom->column_1 }}
Adding a custom client field to an invoice:
{{ $invoice->client->custom->column_1 }}
Adding a custom quote field to a quote:
{{ $quote->custom->column_1 }}
Adding a custom client field to a quote:
{{ $quote->client->custom->column_1 }}
By default, logos are displayed on the invoice and quote PDF's at the actual image size. Higher quality images can sometimes appear pixelated or blurry when they've been resized down to a smaller scale. The solution to this is to upload your logo at the full, high resolution size and then make a quick modification to the custom invoice and/or quote templates.
The default custom templates are located at:
custom/templates/invoice_templates/custom.blade.php custom/templates/quote_templates/custom.blade.php
Open the custom template to modify and change this line:
{!! $logo !!}
To this:
{!! Logo::size(width, height) !!}
For example, to display your logo at a width of 250px by a height of 50px:
{!! Logo::size(250, 50) !!}