If you feel your invoice is not according to your taste or not according to your customer's taste, you can change it according to your needs, this method uses custom CSS / XML, in custom CSS / XML there you can change it to your liking and also according to your needs .

Step 1. Login into tools.dealpos.app

You can Login to tools.dealpos.app by using your POS domain, username, and password :

Step 2. Go to Advance Menu

After you clicking Advance Menu, you can change the File Name into PaperSize8cm_custom.css :

Step 3. Copy the CSS Code down below to PaperSize8cm_custom.css box

I. Resize Store Name

CSS code :

.invoice_mini h1, .invoice_mini h2, .invoice_mini h3, .invoice_mini h4, .invoice_mini h5, .invoice_mini h6, .sales_order_mini h1, .sales_order_mini h2, .sales_order_mini h3, .sales_order_mini h4, .sales_order_mini h5, .sales_order_mini h6 {

font-family: Arial !important;

font-size: 39px;

}

*You can customize font-size for adjust the size

Output will be like :

II. Bold Store Name, Invoice number & Total

CSS code :

.font-weight-bold {

font-weight: 1000 !important;

}

*you also can customize font-weight size for adjustment.

The output will be like :

III. Resize Logo from Square to Rectangle

CSS code :

.img-fluid {

height: 75px;

}

*you also can customize height size for adjustment.

Output will be like :

IV. Give space between Total Amount & Footer

CSS code :

.mt-2, .my-2 {

margin-top: 0.4cm !important;

}

*you can customize margin-top for adjustment.

Output will be like :

V. Change Font on Invoice

CSS code :

.invoice_mini, .sales_order_mini {

width: 264px;

margin: auto;

padding: 0 4px;

color: #000;

font-family: Verdana !important;

}

*you can change font-family for your invoice, for example : Arial, Times New Roman, Candara, Calibri, and many more.

Output will be like :

VI. Delete row space between Address and Number Phone

CSS code :

br{content:' ';}

br:after{content:' ';}

Output will be like :

Did this answer your question?