Widget Print-Receipt

You can enable receipt printing feature in the widget using following quick steps:

1. Add attribute enable-print-receipt in the code.

2. 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.