Hello,
I have just started using Manager, having an issue customizing my invoices.
I have followed the instructions on how to load the example Templates by copying the HTML and CSS codes to my new them however when i view the invoice the contents are empty and instead all contents of the invoice are in the footer.
I am not very familiar with coding however if this doesnt take much to fix i can learn that!!! any idea’s?
thanks
Andrew
Parrot
November 3, 2014, 4:30pm
2
Lubos,
Have to say that is one of the issues holding back a lot of new users. A better selection of invoice samples is really needed. The idea you had of creating a template where all items would be included but could then be deleted (customized) is a great idea.
Any news on this?
1 Like
How about getting the envato (http://themeforest.net/ ) community involved, there are a lot of talented people there.
I would be happy to use the above template if i can get it to work!!! a greater selection would be fantastic though.
I don’t expect any one to teach me how to code, i would however like to see an instruction set for the templates in the guides that works!
I have tried using all three templates and all of them give me the above result. has any one over come this before?
lubos
November 5, 2014, 10:38am
5
@andrewjbrooks1988 what version of Manager are you using? I’ve tested those templates and they work for me in the latest version
@Parrot I’m going to work more on templating sometime this month. There will be support for better templating engine and new set of bootstrap templates.
1 Like
@lubos I am currently using version 14.11.7.
for some reason i get the feeling i am doing something wrong
I am copying the contents of the HTML box to the HTML box in Manager and the same with the CSS code
This is what mine looks like:
However i get the invoice as printed above.
Do i need to alter any of the code?
Thanks in advance
Hi, this is what works for me!
First create a new template and on the left side, in the field HTML copy this:
<table style="width: 100%; font-size: 12px">
<tr>
<td width="77%" style="width: 100%">
<img data-bind="attr: { src: SellerLogoUrl }" src="#" style="max-height: 80px;
max-width: 300px;" />
</td>
<td width="23%" style="text-align: right; white-space: nowrap">
<div data-bind="text: Seller" style="font-weight: bold"></div>
<div data-bind="foreach: SellerContactDetails">
<div data-bind="text: $data"></div>
</div>
</td>
</tr>
</table>
<div style="height:100px"></div>
<table style="width: 100%; border: 1px solid #ccc; margin-top: 20px">
<tr>
<td colspan="2" bgcolor="#C4161C" style="padding: 15px; font-size: 20px; font-weight: bold; border: 1px solid #ccc; text-align:center;"><span style="color: #ffffff">Invoice</span>
</td>
</tr>
<tr>
<td width="67%" style="background-color: #eee; padding: 20px; vertical-align: top; border: 1px solid #ccc;"><div style="color: #666; font-weight: bold;"><u>Issued to:</u></div>
<div data-bind="text: Customer" style="font-weight: bold"></div>
<div data-bind="foreach: CustomerAddressLines">
<div data-bind="text: $data"></div>
</div></td>
<td width="33%" style="background-color: #eee; padding: 0px 20px; vertical-align:middle"><div><b>Date Issued:</b> </div><div data-bind="text: IssueDate"></div><br>
<div><b>Invoice No:</b></div><div># <span data-bind="text: Number"></span>
</div><br>
<div><b>Due:</b></div><div> <span data-bind="text: DueDate"></span>
</div></td>
</tr>
</table>
<div style="padding: 20px 0px; font-weight: bold; font-size: 18px; text-align:center"><span style="color: #999"> Summary </span></div>
<table style="width: 100%; border-top: 1px solid #ccc; border-collapse: separate; border-spacing: 0">
<thead>
<tr>
<th width="45%" style="padding: 5px; color: #C4161C; border-bottom: 1px solid #ccc">Service</th>
<th width="12%" style="padding: 5px; color: #C4161C; border-bottom: 1px solid #ccc">Quantity</th>
<th width="12%" style="padding: 5px; color: #C4161C; border-bottom: 1px solid #ccc">Unit price</th>
<th width="11%" style="padding: 5px; color: #C4161C; border-bottom: 1px solid #ccc">Tax</th>
<th width="20%" style="text-align: center; width: 100px; padding: 10px; color:#C4161C; text-align: right; border-bottom: 1px solid #ccc">Total</th>
</tr>
</thead>
<tbody data-bind="foreach: LineItems">
<tr>
<td style="border: 1px solid #ccc; border-top: none; border-right: none; padding: 10px; vertical-align: top">
<div data-bind="foreach: Description">
<div data-bind="text: $data"></div>
</div>
</td>
<td style="border: 1px solid #ccc; border-top: none; border-right: none; padding: 10px; vertical-align: top"><div data-bind="text: Qty"></div></td>
<td style="border: 1px solid #ccc; border-top: none; border-right: none; padding: 10px; vertical-align: top"><div data-bind="text: UnitPrice"></div></td>
<td style="border: 1px solid #ccc; border-top: none; border-right: none; padding: 10px; vertical-align: top"><div data-bind="text: Tax"></div></td>
<td data-bind="text: LineTotal" style="text-align: right; border: 1px solid #ccc; border-top: none; padding: 10px; vertical-align: top; background-color: #f9f9f9"></td>
</tr>
</tbody>
<tbody>
<tr data-bind="visible: Total != Subtotal">
<td colspan="4" style="text-align: right; padding: 5px 10px">Subtotal</td>
<td style="text-align: right; padding: 5px 10px; border: 1px solid #ccc; border-top: none; background-color: #f9f9f9" data-bind="text: Subtotal"></td>
</tr>
</tbody>
<tbody data-bind="visible: TaxComponents.length > 0, foreach: TaxComponents">
<tr>
<td colspan="4" style="text-align: right; padding: 5px 10px"><span data-bind="visible: $parent.LineItemsIncludeTax">Φ.Π.Α. </span><span data-bind="text: Name"></span>
</td>
<td style="text-align: right; padding: 5px 10px; border: 1px solid #ccc; border-top: none; background-color: #f9f9f9" data-bind="text: Amount"></td>
</tr>
</tbody>
<tbody>
<tr>
<td colspan="4" style="text-align: right; padding: 5px 10px; font-weight: bold">Total</td>
<td style="text-align: right; font-weight: bold; padding: 5px 10px; border: 1px solid #ccc; border-top: none; background-color: #f9f9f9" data-bind="text: Total"> €</td>
</tr>
</tbody>
</table><div></div><div style="padding: 0px 10px; font-size: 12px; line-height: 175%" data-bind="foreach: Notes">
<div data-bind="text: $data" style="font-weight:bold"></div>
</div>
There are some strange things shown on the bill as notes, but when you print it, it will be ok. I hope this will work for you as well
itmoto
November 7, 2014, 4:53pm
8
I am also having the same problem.
nope, still no luck, copied the above code into a new theme into the HTML code section, saved, applied to invoice and no go