Hello RIshal,

Customizing POS Receipt in Odoo 18 (Order Number & Font Size)

To modify your POS receipt template to move the order number to the top and increase its font size, follow these steps:

Method: Custom Receipt Template (No Code Required)

1. Enable Developer Mode
   • Go to Settings → Activate Developer Mode (add ?debug=1 to URL if needed)
2. Access POS Receipt Template
   • Go to Point of Sale → Configuration → Receipts
   • Click on "Edit" for your receipt template
3. Modify the Template
   • Locate the section containing Order 00013-004-0001
   • Cut this line and paste it at the top of the receipt (before "Absolute Vodka")
   • Add style formatting to increase font size:
     xml

     <t t-esc="order.name" style="font-size: 20px; font-weight: bold;"/>

Alternative Method (Using Custom Module)

If you need more advanced control:

1. Create a Custom Module
   • Inherit the POS receipt template by creating:
     xml

     <template id="custom_pos_receipt" inherit_id="point_of_sale.pos_template">
         <xpath expr="//div[hasclass('receipt-order')]" position="before">
             <div class="receipt-order-number" style="font-size: 20px; text-align: center; margin-bottom: 10px;">
                 Order: <t t-esc="order.name"/>
             </div>
         </xpath>
     </template>

Testing Your Changes

1. Preview Changes
   • Use the "Preview" button in receipt editor
   • Print a test receipt from POS interface
2. Adjust as Needed
   • Modify font size values (try 18px-24px for visibility)
   • Add margin/padding if needed for spacing

Important Notes

• Changes affect all POS receipts system-wide
• Consider creating a duplicate template first for testing

Font sizes may vary slightly based on thermal printer models

🚀 Did This Solve Your Problem?

If this answer helped you save time, money, or frustration, consider:

✅ Upvoting (👍) to help others find it faster

✅ Marking as "Best Answer" if it resolved your issue

Your feedback keeps the Odoo community strong! 💪

(Need further customization? Drop a comment—I’m happy to refine the solution!)

Hi,

Please refer to the following links:

Apps: 

1. https://apps.odoo.com/apps/modules/15.0/custom_receipts_for_pos

You can find the latest version from V14 to V18.

2. https://apps.odoo.com/apps/modules/18.0/pos_receipt_extend

You can find the latest version from V14 to V18.

Blogs:

1.https://www.cybrosys.com/blog/how-to-customize-pos-receipts-in-the-odoo-18

2. https://www.cybrosys.com/blog/how-to-customize-pos-receipts-in-the-odoo-17

3. https://www.cybrosys.com/odoo/odoo-books/odoo-17-development/pos/customize-customer-receipts/

Hope it helps.

To bring the order number to the top of the page in the POS receipt and increase its font size, you can use the following approach:

_____ Using External CSS ______

XML CODE:

<template id="custom_pos_receipt" inherit_id="point_of_sale.OrderReceipt">

    <xpath expr="//OrderWidget" position="before">

        <div class="pos-receipt-order-data custom-order-info">

            <div t-esc=" props.data.name ']/.." position="replace">

    </xpath>

</template>

CSS:

.custom-order-info {

    font-size: 20px !important;

    font-weight: bold;

}

___ Using Internal CSS _____

<div t-esc=" props.data.name " style="font-size: 20px !important;font-weight: bold; " />

<template id="custom_pos_receipt" inherit_id="point_of_sale.OrderReceipt">

    <xpath expr="//OrderWidget" position="before">

        <div class="pos-receipt-order-data custom-order-info">

            <div t-esc=" props.data.name " style="font-size: 20px !important;font-weight: bold; " />

            <div id="order-date" t-esc="props.data.date" />

        </div>

    </xpath>

    <xpath expr="//div[t-esc=' props.data.name ']/.." position="replace">

    </xpath>

</template>