Garage

Custom invoice templates have arrived

Few months ago we launched our latest feature – customizable invoice templates, and now we’re starting our very own invoice template store.

Invoicebus invoice templates

The idea for custom invoice templates in Invoicebus was on our minds even from the early days. We wanted to make Invoicebus in a way that everyone will be able to customize their invoice design and layout as they want without any limitations. Most of the time we took mental notes on how we would like such invoice templates to work but we didn’t feel comfortable to start with the realization. We knew something was missing so we let the idea distill itself and after the summer last year we finally started coding and iterating through different concepts.

We wanted the invoice templates to follow two major things:

  1. To be easily imported and used in Invoicebus without modifications
  2. To be used standalone without any dependency from Invoicebus

Few months ago we silently launched this in beta as we were still fine tuning the details. Now we believe it’s time to announce its official launch.

Custom Templates

Without hesitation we knew the templates should be made with HTML and CSS. That way they can be used in Invoicebus without converting from one format to another. We finally put to realization our collected notes and made our invoice templates framework. Some rules were also set to make sure the templates are compatible with the new version of Invoicebus.

Professional invoice template Niana (brick)

However, one of the most interesting parts was making the templates work standalone. It’s easy to imagine Word or Excel invoice templates working standalone, well not really standalone as MS Office is still required, but who doesn’t have one right? But to make working HTML/CSS template we had to somehow make it dynamic and usable on the fly. That’s when we decided to make the HTML Invoice Generator. This is a simple script that can be included at the bottom of an HTML invoice template, and it’ll transform it to fully functional invoice editor with the following features:

  • Ready to fill out and print on the fly.
  • Can be easily customized with your own logo and colors.
  • Support any language and currency.
  • Support multiple taxes.
  • Auto calculate subtotals, totals, taxes, and discounts.
  • Configurable columns, date format, and symbol position (left/right).
  • Manipulate rows with simple drag and drop.
  • Run directly in a browser on your local computer (PC, Mac, Linux).
  • No setup or additional software needed.
  • Hassle-free integration with Invoicebus.

We’ve never really liked Word/Excel invoice templates as they’re pretty hard to work with. The layout can get messed-up easily and the calculations are hard to tweak with all that item rows and totals. We’re pleased we can offer something new, something fresh in the invoice templates world. Actually we got so excited that we made a decision to open the technology for the invoice generator. If you’re tech savvy and know your way with web technologies you can grab the code yourself at GitHub and tweak it to your needs. We even prepared a guide you can follow if you want to create your own invoice template. If you decide to use the script as is, no more than basic HTML & CSS knowledge is required to create your own invoice template.

Corporate invoice template Loretta (violet)

The best thing about the templates is their seamless integration with Invoicebus. You can pack your custom template in a zip file and upload it to Invoicebus, or even simpler – we embedded “Save” button that will do all the heavy-lifting for you (described at the end of the post). It’s great to know that not only your online invoices, but also the PDFs you generate will have the new invoice design you applied.

Interactive example

Here’s a live example of an invoice template you can play with:

Note: this is a scaled-down version for demonstration purposed only and it lacks some of the actual features. The real templates are with bigger size and are more usable.

Templates Store

We made the template framework and the invoice generator, but we didn’t want to leave our users hanging in that state. No matter how simple and straightforward everything might seem, designing a template can be a burden and time consuming task for many people. That’s why beside the 6 basic templates already included in the bus we decided to include another 4 premium templates, all ready to use*.

The icing of the cake is our newly launched Template Store, where you can browse over a dozen creative designs and choose the one closer to your brand and colors. There you can find different styles of templates – generic, corporate, retro, handwritten, etc., that will amplify your professionalism when presented to your clients.

Generic Invoice Template Cobardia (turquoise)

Cool thing is that you can use this invoice templates independent of Invoicebus. They are standalone and autonomous so you don’t need an Invoicebus account to create invoices with them. However, because they’re HTML/CSS based there’s no easy way to save the invoice locally on your computer. That’s why we added “Save” button that saves the invoice data and the template to Invoicebus with a single click. Of course this is completely optional and you can always print or save the invoices to PDF (with Google Chrome) for future reference.

So go ahead and check out the amazing templates we have in the store.

* Custom and premium invoice templates in Invoicebus are available for Single-decker and Double-decker subscription plans.

Dimitar Stojanov
Dimitar is co-founder of Invoicebus, an online invoicing tool for easy invoice management. He's passionate about creating beautiful and simple web applications and occasionally writes on this blog about web design, online business, and fighting the status-quo. Follow him on Twitter and Facebook.
Dimitar Stojanov
RT @invoicebus: How to Set Up A Reliable In-House Payment System - https://t.co/2dZDIpRwxj https://t.co/wA1fO90k3P - 3 weeks ago
Dimitar Stojanov

Latest posts by Dimitar Stojanov (see all)

Leave a Comment