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>