DESKTOP EDITION CLOUD EDITION SERVER EDITION GUIDES FORUM

Editing Invoice Template


#1

How can I edit invoice template so that I can use my customized template to print because I am using Pre-printed invoices to lower my printing cost, so that my old software only prints invoice no, customer information, date, and the items details with total. So is there a way to customize invoice template in a drag and drop manner. here is the format I am using.


#2

Wait until end of this month, there will be new template system that will allow you this kind of customization.


#3

Eagerly waiting for this update.


#4

is this available yet? Looking to edit current invoice


#5

@Nat_Petroff Yes, it has been available for quite some time.
Look under Settings tab and then View Templates.

@Awais there is no drag and drop but here’s a little trick.
Create your invoice in HTML, starting with managers default template, and then hide the objects you don’t want printed.

first add a little heading:

<style media="print">
    /* Does not show on print but does show on view and occupies its space */
    .invoice .hidden { visibility: hidden; }
    /* Does not show on print but does show on view and does not hold space */
    .invoice .visible { display: none; }
</style>

then give the outer surrounding table a class name, so it doesn’t mess up managers classes.

change: <table style="width: 100%">
into: <table class="invoice" style="width: 100%">

then hide your logo

change: <img src="{{ business.logo }}" style="max-width: 300px; max-height: 150px">
into: <img src="{{ business.logo }}" class="hidden" style="max-width: 300px; max-height: 150px">

This should get you started, have fun.