Widget Print-Receipt
Enable transaction receipt printing in your website with your company's full branding.
You can enable receipt printing feature in the widget using following quick steps:
-
Add attribute enable-print-receipt in the code.
-
Add CSS to hide your website elements from printing (at the end of your CSS).
<style>
@media print {
body {
background:none !important;
color:#000;
padding:0;
margin:0;
-webkit-print-color-adjust:exact;
print-color-adjust:exact;
}
.header, .footer, .menubar {
display:none !important;
}
}
</style>
NOTE
The print receipt feature works on mobile as well. Just connect any mobile compatible printer to your mobile phone using Bluetooth, Wifi or a USB cable and start printing receipts.
It also works with any paper size!
To ensure that your CSS is correctly working, print out a sample receipt from our Widget Demo and compare it to your website's printed receipt
Add Print-Receipt Branding
You can set the logo, title, sub-title and the terms & conditions text by setting the following attributes after enable-print-receipt:
receipt-logo = "https://yourcompany.com/company_logo.png"
receipt-title = "ABC Communications"
receipt-sub-title = "Shop no.1, New Market, East Delhi - 110001"
receipt-tnc = "Terms and conditions appplied for all transactions"
TIP: You can use the title and subtitle to show your merchant's shop name and address so that it is good for your merchant's branding and easier for their customers to come back to their shop.
Updated over 4 years ago