# Invoice Template issue

**URL:** <https://forum.manager.io/t/invoice-template-issue/6139>\
**Category:** Uncategorized\
**Created:** [June 22, 2016, 4:51am UTC](https://forum.manager.io/t/invoice-template-issue/6139 "2016-06-22T04:51:53Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Duck\_Duck](https://avatars.discourse-cdn.com/v4/letter/d/aeb1de/32.png) [@Duck\_Duck](https://forum.manager.io/u/Duck_Duck)\
**Post date:** [June 22, 2016, 4:51am UTC](https://forum.manager.io/t/invoice-template-issue/6139/1 "2016-06-22T04:51:53Z")

</div>

Hi, I’ve difficulties with customizing invoice template. The system layout broken after previewing my template.

This is how it looks when I preview the invoice

 ![](https://us1.discourse-cdn.com/flex019/uploads/manager1/original/2X/d/dea278df7105df58ac17b0add586939c7af152ea.png)  
  
  
  

It looks just fine right? Yet, when I closes the preview, the system became like this (it looks normal after I return to previous page)

 ![](https://us1.discourse-cdn.com/flex019/uploads/manager1/original/2X/2/2d85a80d14ff12380326976c8d12cd9c2fd72bcb.png)  
  
  
  
  
And If I try to print the invoice, it became like this  
 ![](https://us1.discourse-cdn.com/flex019/uploads/manager1/original/2X/1/18f5d449e956a8b1609a54cfdcb16b9a78812049.png)

May I know where should I look to fix this? Let me know if you need more information.  
I’m using ver 16.5.55 on mac OS X 10.11

---

<div class="post-metadata">

**Author:** ![lubos](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.manager.io/lubos/32/62798_2.png) [@lubos](https://forum.manager.io/u/lubos)\
**Post date:** [June 22, 2016, 5:28am UTC](https://forum.manager.io/t/invoice-template-issue/6139/2 "2016-06-22T05:28:55Z")

</div>

Your HTML template is injected into the app UI which is also HTML document. You need to rewrite your HTML template so it doesn’t leak.

For example, I’ve noticed you have tags like `<html>` or `<head>` in your HTML template. Those must be removed. Also you have global CSS styles. You need to remove those too.

---

<div class="post-metadata">

**Author:** ![Duck\_Duck](https://avatars.discourse-cdn.com/v4/letter/d/aeb1de/32.png) [@Duck\_Duck](https://forum.manager.io/u/Duck_Duck)\
**Post date:** [June 22, 2016, 9:07am UTC](https://forum.manager.io/t/invoice-template-issue/6139/3 "2016-06-22T09:07:30Z")

</div>

Thanks

---

<div class="post-metadata">

**Author:** ![anoopchintu](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.manager.io/anoopchintu/32/1067_2.png) [@anoopchintu](https://forum.manager.io/u/anoopchintu)\
**Post date:** [June 23, 2016, 4:16am UTC](https://forum.manager.io/t/invoice-template-issue/6139/4 "2016-06-23T04:16:22Z")

</div>

With recent version upgrade, I find the custom templates have changed automatically with regard to “Notes”. Was using custom templates so far and the placing of ‘Notes’, was perfect. (Image below)

 ![](https://us1.discourse-cdn.com/flex019/uploads/manager1/original/2X/0/05a8ac1495419e62baa4530542c59198de308bad.png)  
However, this has changed automatically with the recent upgrade without any edit done to the template. (image below)  
 ![](https://us1.discourse-cdn.com/flex019/uploads/manager1/original/2X/0/01e8b04116c71838ea550a7478a8450da6116071.png)  
Please see that the bold font too has changed…  
Any solution?

---

<div class="post-metadata">

**Author:** ![lubos](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.manager.io/lubos/32/62798_2.png) [@lubos](https://forum.manager.io/u/lubos)\
**Post date:** [June 23, 2016, 4:20am UTC](https://forum.manager.io/t/invoice-template-issue/6139/5 "2016-06-23T04:20:46Z")

</div>

In your HTML code, instead of `{{ notes }}` use `{{ notes | newline_to_br }}`

---

<div class="post-metadata">

**Author:** ![anoopchintu](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.manager.io/anoopchintu/32/1067_2.png) [@anoopchintu](https://forum.manager.io/u/anoopchintu)\
**Post date:** [June 23, 2016, 4:23am UTC](https://forum.manager.io/t/invoice-template-issue/6139/6 "2016-06-23T04:23:22Z")

</div>

Thank you very much. For the bold font? \*\* not working…

---

<div class="post-metadata">

**Author:** ![lubos](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.manager.io/lubos/32/62798_2.png) [@lubos](https://forum.manager.io/u/lubos)\
**Post date:** [June 23, 2016, 4:28am UTC](https://forum.manager.io/t/invoice-template-issue/6139/7 "2016-06-23T04:28:09Z")

</div>

Use HTML tag `<b>` so ` **Bank Details:** ` should be `<b>Bank Details:</b>`

---

<div class="post-metadata">

**Author:** ![Ealfardan](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.manager.io/ealfardan/32/63166_2.png) [@Ealfardan](https://forum.manager.io/u/Ealfardan)\
**Post date:** [January 18, 2023, 3:32pm UTC](https://forum.manager.io/t/invoice-template-issue/6139/8 "2023-01-18T15:32:47Z")

</div>


