This post was last updated 11 years 9 months 10 days ago, some of the information contained here may no longer be actual and any referenced software versions may have been updated!I needed to create a custom invoice that was easily printable for a Magento store. The built in PDF generation system (at least in earlier versions of Magento) was not very flexible and did not meet my requirements.
The solution looks great – see example below and contains some nice touches including the option to create a watermark graphic on the invoice and a comments box.
I have also developed a standalone invoice management solution that can run externally to magento. Click here for more.
DOWNLOAD (github)
Tested with Magento CE 1.3 -> 1.9.x
WISHLIST
- Add an Email button to email the HTML invoice directly to the customer.
Installation
Modman
modman clone https://github.com/gaiterjones/magento-htmlinvoice
Manual
Download and extract the source files and copy to your Magento root folder.
Refresh your Magento system cache, log out and back into admin to enable the module and confguration area.
Configuration
The extension is configurable under system > configuration > my extensions > html invoice. The configuration consists of some options to help customise the html invoice.
LOGO URL
Enter the URL to an image to use as a logo to appear on the invoice. Default if blank is no logo.
WATERMARK URL
Enter the URL to a watermark image if you want to use one. Default if left blank is no watermark image.
HEADER TEXT
Enter the text (or html) you want to appear at in the header of the invoice, your company name and address for example. Default is no header
SHOW COMMENTS BOX
Select Yes to enable the comments box on the invoice, this lets you type a short comment that will appear on the printed invoice.
FOOTER TEXT
Enter the text (or html) you want to appear on the bottom of the invoice. Default is no footer text.
ADD VAT / TAX TO PRICING
Set this to YES and then specify your VAT rate as an integer i.e. 19 for 19% VAT, this will add VAT to the invoice pricing at the rate you specify.
Save any options you have changed and goto an order in Sales > Orders. Select an order to view and you should see a new PRINT button on the top right hand side of the order view screen.
Clicking the print button will open the HTML invoice for this order in a new browser tab. An invoice example is below.
To customise the invoice further just take a look at the code in
app/design/adminhtml/default/default/template/paj/htmlinvoice/invoice.phtml
This contains all the formatting for the invoice and is fairly easy to modify for your exact requirements.
To extract individual product information to display on the invoice insert the following within the foreach loop
$_product = Mage::getModel('catalog/product')->load($_item->getProductId());
Now you can echo out product information e.g. custom attributes
$_product->getMy_custom_attribute();
Acknowledgments again to the original developer for parts of the code used in this solution.
Hi,
I just installed your Customiseable, Printable, HTML Invoice for Magento – FREE Magento Extension is there a way to display in the invoice preview the detailed taxes, here in canada we have two taxes…
I want to display :
Taxes 1 :
Taxes 2 :
Thanks
The invoice is easily customised with whatever information you want, if you have some experience with Magento and PHP you can edit the admin invoice template phtml file to add the values you require.
Hi Paj, great one.
Does this work for Enterprise 1.12.* edition?
I don’t have a copy of the enterprise edition so I have not tested any of my modules with it, try it and let me know!
Very nice extension but i noticed a detail fault. On the invoice it say’s “invoice number” but actually i see and it is the order number.
Invoice number: is ordernumber
hope we can change that?
I will fix that.
Well thank you very much, quick answer.
How can i / we receive the change?
Have updated the code, download v0.0.2 of the package and install again.
i am sorry that i was not clear to you, the change is ok (text), but i meant to retrieve the invoice number (value) instead of the ordernummer (value).
i hope that you can do that? if you have the code to put it under the ordernumber or instead of the ordernumber that is okay too, i can put it in the invoice.phtml.
at least super for your quick support.
v0.0.3 now shows the invoice number on the html invoice – if one exists, if no invoice exists the order number is displayed.
Many thanks for your support. it works great.
Hello PAJ!
Your extension – simple and beautiful!
Some trouble with multiple invoices for one order. It shows only latest invoice number, but I think it should be two different invoices.
How would you like it to handle an order with multiple invoices?
I didn’t use multiple invoices. But I found it when did a small test for your extension. May be Invoice detail page should have your “Print” button too?
Man, you’re great! I was too lazy to do it by myself and was waiting for somebody to do this for me! By the way, i recomend to publich it to magento connect and create paypal account for donations 😉
Great code!Thank
How to display product images?
I have to find a way to add images
$imageCollection = Mage::getModel(‘catalog/product’)->load($item_id);
foreach ($imageCollection->getMediaGalleryImages() as $_image);
helper(‘catalog/image’)->init($imageCollection, ‘small_image’, $_image->getFile())->resize(100).'” />
I will add this to the wishlist, it should be fairly easy to achieve so that a product image appears next to each line of the invoice if required.
I put the pictures of the products as follows: (invoice.phtml)
Add to the table header the following line:
ImagemLook for the code in the file:
foreach($_items as $_item) {if ($_item->getParentItem()) continue;
Just below enter the following code:
// ********************* inserir imagem ************************
$item_id= $_item->getProductId();
$image = Mage::getModel('catalog/product')->load($item_id);
$imagePath = Mage::helper('catalog/image')->init($image, 'image')
->keepAspectRatio(true)
->keepFrame(false)
->resize(80,80)
->__toString();
// *****************************************************************
And just below the “echo” of table rows look for:
echo ' ' . "\n" .
</code
and add below:
''."\n".
Works Great!!
I hope I have helped!
ops! the code did not show up! I’m sorry!
In the picture are:
Image
the echo is:
echo ‘ ‘. “\ n”.
and below is:
‘ ‘. “\ n”.
oh no! not appeared again!
I’ll take the ” tags to display the code. Sorry!
In the picture are:
td class = “dataTableHeadingContent”> Image ‘. “\ n”.
and below is:
‘Td class = “dataTableContent” valign = “top”> ‘. “\ n”.
I need to move the placement of the fields around to utilize my integrated labels stationery. Is this possible, if so, how would I do it?
Thanks
The html code for the printable invoice is in the adminhtml template file paj/htmlinvoice/invoice.phtml. Simply edit the html to your requirements.
Hi,
Great extension.
but print the order not the invoice!
I need this extension to work for order and invoice also, Ho can I do that?
Thanks
The invoice.phtml file can be edited to format the data however you wish, if you have some html skills this should be relatively easy for you. If not, give me an idea as to how you want to display the order on the printout, i.e. the same as the order confirmation email?
Hi PAJ,
Thank you for your support & time 🙂
I want to show “Print HTML” button on the invoice page and I need the printable version to be like the invoice email please
Thanks,
Bassem
Help, I get a 404 error on the config page for this extension. Do you know why?
Never mind, it seems to be working now. I guess I needed to clear cache
You should always refresh cache, then logout and back into admin after installing any new Magento modules.
Hi, today I installed your extension and it’s realy cool but I get a 404 error when I try visiting the configuration page. I already cleared the cache and relogged into the adminpanel, I don’t use a custom admin template.
Can you please help me with this?
Greetings
Andreas
Okay, now it works. I cleared the cache but didn’t refreshed it. So after refreshing all works fine.
Will it replace the default pdf invoice system of magento?
will this html invoice be sent to customer in email or the default pdf invoice?
email attachment to email will be html or pdf?
This module does not replace any of the inbuilt Magneto invoice creation methods, it simply adds a new button to each order view that creates an html based invoice that can be easily customised and printed.
I love this extension! I have two things on my wishlist for it, though:
1 – Do you have a way for it to show the invoice number AND the order number?
2 – Do you have a way to mark the invoice with a PAID graphic if it’s been paid?
Yes I think it is straight forward to show both invoice and order number. The stamp graphic can be whatever you want it to be, so if the invoice has been paid just click the button to show the stamp…
You Simply Rock. Exactly what I wanted…Thanks very much
Great, if you like the extension please sign up for a Dropbox account using the link on my about page!
i could not see the print button on the order view
using magento ce 1.7.0.2
Make sure you have refreshed your Magento configuration cache and logged out and back into admin, then you should see the button if you have installed the module correctly.
Thank you very much! This is awesome and easy customizable solution for invoices.
Can i use this for Credit Memo somehow?
Have nice day and thank you again! 🙂
I am interested in this too. Credit memo would be nice.
what do you mean exactly, printable credit note?
I cannot answer your comment below so I answer mine 🙂 So yes..like you print an invoice, you can print a credit memo. It would be designable as invoice. If a credit memo exist, then other printing button for this memo in admin area would be nice.
Hi!
Very nice extension, works perfect for me. Now i got this i want more!
invoice.phtml is very easy to customize.
So i want a second invoice.php with some other option in it!
So i get invoice.phtml and invoice_bb.phtml. And on the order 2 buttons: Print and Print BB.
Is that possible?
Everything is possible. You will need to add the second button by editing the module configuration and template code. I will take a look.
I would also like this feature, did you ever get round to doing it?
Do you mean displaying product attributes in the invoice view? Yes this was easily accomplished.
I did it, it’s pretty simple. I created a second button to print the messages gifts. I made a template with a background of gift card and put messages inside. It was very good!
Steps I performed:
– Duplicate file “invoice.phtml” with another name and configure how you want.
– I created a second section in the file adminhtml.xml
– Added the second section in system.xml file with the necessary options (to display in admin)
– Added the second button in the view.php file (folder Block)
– Created the second file invoice.php pointing to the template phtml. (Block paste)
– Add a second function within the file IndexController.php. Duplicate function invoiceAction under another name (same as used in file view.php) to call the new Block.
I think that was it!
That would be great!
I try it myself… but its not working.
When it try to duplicate the button in the view.php. It only shows only the button that i duplicate.
I hope you can help me!
How to delete button print in pdf after printed ?
Firstly Thanks,
This is a great extension!
We would like to add a location and barcode field to the printable invoice we have added the heading but can’t get the content to display can you tell us how to do this please. The below is what we have added
‘ ‘ . $_item->getlocation() . ” . “\n” .
‘ ‘ . $_item->getbarcode() . ” . “\n” .
We are also using Delivery Notes extension from here http://www.magentocommerce.com/magento-connect/delivery-instructions.html? on checkout is there a way to add this to the invoice too?
Thanks
Hi, where have you taken the methods getlocation and getbarcode from? Are these from another third party extension?
Hi Paj,
Thanks for replying.
I just copied your formatting of how you were getting the Sku etc. I’m guessing this is not enough then?
The location and barcode are custom attributes i created if that’s what you meant.
Thanks
first of all thans for this.
but my problem is how can i apply this format in frontend side to view pdf invoice after order complete.
please help me
My friend, your blog is very good. High tips!
This module was simply perfect.
I put a first column with the image of the product and also added a column before the column of the price with gift mensages.
It was very good.
Now I’m putting another button in order to print the messages of gifts in a personalized card.
Modifying the file, the possibilities for customization are endless. Very useful this module. Congratulations again!
I have updated the code to include the option to show images on the invoice, this also loads the product into the invoice view so that other product attributes can be extracted as required.
Dear Paj,
your module is very interesting.
I installed a previous version, specifically v.0.0.3.
How can I safely upgrade to the new version 0.1? I just simply need to overwrite the files?
Thanks in advance,
Alessandro
Yes, just copy the new files over the old.
Your extension – simple and beautiful! but I have a question?
Now, I got an order. (of 5 products) and I refunded a product and print button is clicked. I can see, I have canceled items have been added.
what should I do?
Thank you
Hi I am getting the following error ?
Trace:
#0 /opt/lampp/htdocs/magento/app/code/core/Mage/Catalog/Helper/Image.php(83): Mage_Catalog_Model_Product_Image->setBaseFile(‘no_selection’)
#1 /opt/lampp/htdocs/magento/app/design/adminhtml/default/default/template/paj/htmlinvoice/invoice.phtml(325): Mage_Catalog_Helper_Image->init(Object(Mage_Catalog_Model_Product), ‘small_image’)
#2 /opt/lampp/htdocs/magento/app/code/core/Mage/Core/Block/Template.php(241): include(‘/opt/lampp/htdo…’)
#3 /opt/lampp/htdocs/magento/app/code/core/Mage/Core/Block/Template.php(272): Mage_Core_Block_Template->fetchView(‘adminhtml/defau…’)
#4 /opt/lampp/htdocs/magento/app/code/core/Mage/Core/Block/Template.php(286): Mage_Core_Block_Template->renderView()
#5 /opt/lampp/htdocs/magento/app/code/core/Mage/Adminhtml/Block/Template.php(81): Mage_Core_Block_Template->_toHtml()
#6 /opt/lampp/htdocs/magento/app/code/core/Mage/Core/Block/Abstract.php(863): Mage_Adminhtml_Block_Template->_toHtml()
#7 /opt/lampp/htdocs/magento/app/code/local/PAJ/HTMLinvoice/controllers/IndexController.php(26): Mage_Core_Block_Abstract->toHtml()
#8 /opt/lampp/htdocs/magento/app/code/core/Mage/Core/Controller/Varien/Action.php(420): PAJ_HTMLinvoice_IndexController->invoiceAction()
#9 /opt/lampp/htdocs/magento/app/code/core/Mage/Core/Controller/Varien/Router/Standard.php(250): Mage_Core_Controller_Varien_Action->dispatch(‘invoice’)
#10 /opt/lampp/htdocs/magento/app/code/core/Mage/Core/Controller/Varien/Front.php(176): Mage_Core_Controller_Varien_Router_Standard->match(Object(Mage_Core_Controller_Request_Http))
#11 /opt/lampp/htdocs/magento/app/code/core/Mage/Core/Model/App.php(349): Mage_Core_Controller_Varien_Front->dispatch()
#12 /opt/lampp/htdocs/magento/app/Mage.php(640): Mage_Core_Model_App->run(Array)
#13 /opt/lampp/htdocs/magento/index.php(80): Mage::run(”, ‘store’)
#14 {main}
Does this extension allow for bulk (mass action) generation / printing of invoices?
Thanks
Not at the moment.
how can i display german vat in % to invoice..
please help me.
thanks
VAT is VAT, was meinst du mit German VAT?
Hi, Thanks again for making this extension free and updating it.
We have a multi-store setup is there a way to have different templates for the wholesale and retail stores?
e.g. a basic list for the wholesale stores and an image one with a big cut off address section at the top for the retail stores
Yes this is easy to achieve, we would get the customer group from the order to identify the group the order belongs to – wholesale/retail and then style the invoice html as required.
Hey:
In the row total I want the price to be shown inclusive of Tax. I want the look & feel similar to the invoice I can take from the frontend of the website.
Please suggest.
You can edit the html and css in the invoice phtml file to style the look of the page exactly how you want.
I want something similar. But where to take including VAT from ? For sum and for any of the items per row in the list?
Including VAT (this is kind of standard in Germany, BTW)…. is what I am asking for in my posting from today also.
The info ” You can style CSS and HTML in the file” is apparently not enough, I am sorry….
How exactly?
Thanks in advance.
Cheers. Andre
Hi, I installed. When I click the Print button the browser display “Service is unavailable”. Browser error message:
Error: The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol.
Any idea how I can get it resolved. Thanks
edit invoice.phtml and add the character coding declaration that you need in the heading. Google ‘Declaring character encodings in HTML’ for more info.
Great module.
Please consider to add translation files. At the moment I am running a Dutch webshop, and the invoice should not be in English.
It works great.
This is a great extension!!!!!!!
Thanks..
Hi,
I am getting this error, after installing the files and running a test.. any help would be great.
Error:
Image file was not found.
Trace:
#0 /var/www/html/magento/app/code/core/Mage/Catalog/Helper/Image.php(83): Mage_Catalog_Model_Product_Image->setBaseFile(”)
#1 /var/www/html/magento/app/design/adminhtml/default/default/template/paj/htmlinvoice/invoice.phtml(325): Mage_Catalog_Helper_Image->init(Object(Mage_Catalog_Model_Product), ‘small_image’)
#2 /var/www/html/magento/app/code/core/Mage/Core/Block/Template.php(235): include(‘/var/www/html/m…’)
#3 /var/www/html/magento/app/code/core/Mage/Core/Block/Template.php(266): Mage_Core_Block_Template->fetchView(‘adminhtml/defau…’)
#4 /var/www/html/magento/app/code/core/Mage/Core/Block/Template.php(280): Mage_Core_Block_Template->renderView()
#5 /var/www/html/magento/app/code/core/Mage/Adminhtml/Block/Template.php(81): Mage_Core_Block_Template->_toHtml()
#6 /var/www/html/magento/app/code/core/Mage/Core/Block/Abstract.php(758): Mage_Adminhtml_Block_Template->_toHtml()
#7 /var/www/html/magento/app/code/local/PAJ/HTMLinvoice/controllers/IndexController.php(26): Mage_Core_Block_Abstract->toHtml()
#8 /var/www/html/magento/app/code/core/Mage/Core/Controller/Varien/Action.php(420): PAJ_HTMLinvoice_IndexController->invoiceAction()
#9 /var/www/html/magento/app/code/core/Mage/Core/Controller/Varien/Router/Standard.php(253): Mage_Core_Controller_Varien_Action->dispatch(‘invoice’)
#10 /var/www/html/magento/app/code/core/Mage/Core/Controller/Varien/Front.php(176): Mage_Core_Controller_Varien_Router_Standard->match(Object(Mage_Core_Controller_Request_Http))
#11 /var/www/html/magento/app/code/core/Mage/Core/Model/App.php(340): Mage_Core_Controller_Varien_Front->dispatch()
#12 /var/www/html/magento/app/Mage.php(627): Mage_Core_Model_App->run(Array)
#13 /var/www/html/magento/index.php(80): Mage::run(”, ‘store’)
#14 {main}
There seems to be a problem getting your product image. What version of Magento are you using?
I am using Magento 1.7.0.0 version.
I got this error too, please let me know how to resolve this.
Hi,
I would like to show the product prices in gross (including VAT) in the list and then below, show them in sum including vat and then below this the VAT excluively (like it is now, basically already).
Thats because the products are shown including VAT in the shop also and when the customers see them including VAT and then exclusive VAT in the invoice they get irritated (client has had lots of complaints about the “wrong”prices…
How can I achieve this?
Cheers.
Andre
Hi,
still no success. I tried to check the settings in magento. They are set up that prices in invoices are shown incl. of VAT (19%). But HTML invoice doesnt take over the standard setting from Magento. Sadly.
Which would be the php code snippets from magento that show the price including VAT? so that I could change it in the according file of HTML invoice…
Please can anybody tell me how to do it?
Thanks in adavance….
(BTW, I guess this is a good extension, and thanks for providing it to the community)
P.S.: Making it rely on tax settings of magento would be a good idea, wouldnt it?
Hey, the tax rules in magento are quite complicated! I have update the code to allow you to manually enable VAT and set the VAT rate. The options are in the config, set add vat to yes and then enter an integer for the VAT rate, i.e for 19% enter 19
I have tested it quickly seems to work, the latest files are in the GIT hub, get them from there and update your code. Let me know how you get on. I have also added a check to try and fix the missing image problem too.
This is great Extension. Thanks…
Can we have bulk (mass action) generation / printing of invoices in near future?
I am developing an external invoice maanager, I think this would be more achievable with that. Check out the work in progress from my latest blog post.
Hi, this is a great extension and have been using it since we launched our site with Magento. There is one feature I would like though. Would it be possible to select orders on the main orders page, and then print off multiple order invoices, rather than going into each individual order to print? Previously we used Opencart and it had this feature (it would simply just string all the invoices together into one html page, like looping the html code for each order)?
Thanks
Dan
hi is it possible to add this to sales orders page for mass action? if so any idea where to start
Check out my latest external order management script, its a better options for mass printing invoices.
Is there a way to output bundle item options? At the minute if someone orders a bundle product, on the invoice all that appears is the product title, and not the options. How would I go about adding this to the template?
Regards
Dan
I have actually never worked with bundled items in Magento, it will be possible you just need to detect a bundled item in the code and then display it the way you want on the invoice.
Beautiful extension….
But I want to display print button inside Invoce. Plz help…
I tried to add this code
$this->_addButton(‘order_reorder’, array(
‘label’ => Mage::helper(‘sales’)->__(‘Print’),
‘onclick’ => ‘window.open(\” . $this->getUrl(‘htmlinvoice/index/invoice’) . ‘\’)’,
));
inside
app/code/core/mage/Adminhtml/Block/sales/Order/Invoice/View.php.
then click print button gives 404 error….
Plz help…
Does this work on version 1.8?
Should do! Try it and see 🙂
Thanks! We’ll try it. The built in Magento features are a pain!!
This might be of interest to you too. https://blog.gaiterjones.com/magento-html-invoices-print-save/
Yes tested and working with 1.8.1.0
tested and working with 1.8.1.0
where can i download the latest version?
The download is at github, see the link at the top of the page, also check out the standalone invoice app https://blog.gaiterjones.com/magento-html-invoices-print-save/
Hi, Is there a possibility to get this extension to print in bulk? I’ve tried your other extension which is very good but we have multiple users that need to use it and keeping it one place would be more ideal.
I don’t have any plans to develop this extension any further sorry.
Hello,
Thank you very much for sharing your extension, it’s working for me on 1.8. Just wondering… Is there any way to get printing page on a pop-up window instead of a new tab?
If it opens in a popup you will not be able to print it, as the browser print function will print the popup and parts of the page behind it. My standalone app shows the order in a popup, and allows you to print with one click.
Ok, thanks again.
Fatal error: Call to a member function toHtml() on a non-object in /home/user/public_html/app/code/community/PAJ/HTMLinvoice/controllers/IndexController.php on line 20
Using Magento CE 1.8.1
Hi, this module was tested on Magento versions CE 1.4 -> 1.9 so it should be working ok. I just tested it again in my dev store. Are you sure you have installed the module correctly?
Great extension! Do you think this kind of functionality could be applied to reports? In order to get a print button in sales reports.
Thank you.
Yes, I think it could.
ACCESS DENIED
When one of my managers or staff members tries to use the print button, it gives them an ACCESS DENIED error. We tried giving them configuration access in the user roles, but that didn’t work.
What setting in the permissions will give them access to using this module?
– Siobhan
I have a ACCESS DENIED too for our staff member. It starts after aplication of patches for magento I guess. Admin user with all privilegs is without any problem.
There is sollution for ACCESS DENIED page for a staff members
http://magento.stackexchange.com/questions/73646/access-denied-errors-after-installing-supee-6285
thanks for letting me know about this, I will fix the module next week.
Hi
Great module. However when print i get an empty space up at the top before the company header area. How can i close the gap ?
Hi
great extension. I have two questions: is it possibile to add paypal transaction ID (i’ve tried in different ways to call this data but I can’t make it work. Second and last question: is it possibile to send via email with this invoice instead of the default magento ones? Thank you.
Best regards,
Elena
To get the paypal transaction id you can add
echo $_order->getPayment()->getLastTransId();around about line 306 in invoice.phtml. You may want to check this returns a value, or you might want to detect paypal payment methods if you just want to show the paypal transaction id.
If you want to replace the default invoice email you would be better off looking at customising the email templates to achieve what you want. If you want to be able to email this invoice from the admin page then that is also possible, but would require further dev work.
Is there a similar one available for Magento 2 ..?
not yet…
Hi,
we have use the extension for a change in invoice. All are done except the tax part as we have two forms of tax class which need to be shown in Invoice. Please help us how to call two taxes by using this extension.
Thanks…..
Thnak you so much for sharing this extension. How can i use this extension will you please help me.
Hi,
Do you provide the same extension for magento 2.3.1?
Sorry, no.
How can I add 2nd button for print? I’d like to make invoiceA & invoice B
If you can advise how to build second button with second template would be appreciated.