Project overview

WowInvoice is a WooCommerce plugin by WPXPO that handles the paperwork after a customer places an order. It's free on WowInvoice on WordPress.org. A store sets it up once - store details, a template, which order statuses create a document - and every order then gets its PDF invoice, packing slip, and delivery note automatically. WowInvoice Pro adds picklists, shipping labels, credit notes, and UBL invoices. The plugin has two halves. A PHP side prepares order data and renders PDFs. A React admin app is where store owners design documents, preview them, and decide when they're generated and emailed. I worked mostly on the React half. Samin Yaser built much of the PHP document and PDF pipeline, and we both worked heavily on the builder and the document templates.

One builder for three document types

Invoices, packing slips, and delivery notes share most of their layout but differ in what they show. A packing slip has no prices; a delivery note needs a signature line. I didn't want three builders that drift apart. The builder runs on one shared state context, and each document type plugs into it with its own default data, template context, sidebar, and feature list. Adding a document type means describing it in those files, not copying a screen. Most of the packing-slip and delivery-note templates and their sidebars are my code.

A live preview you can click to edit

The builder shows the document as it will print. Clicking part of the preview opens the setting that controls it. Samin built that overlay. My part was making it work for parts shared across every template - logo, watermark, barcode - and making the settings panel respond. I built the settings Accordion and moved its open state into the builder context, so a click in the preview can open the right section and outline it. The full decision is in the click-to-edit case study.

A component kit that feels native to WordPress

Store owners spend their day in wp-admin, so the builder should look like part of it rather than a separate app. I built most of the plugin's shared UI kit - select, multi-select, tabs, sidebar, accordion, toasts, and confirmation prompts. Every screen in the admin app is built from it. One kit means a fix or a style change lands everywhere at once. Labels in the selects go through WordPress's i18n functions, so they translate with the rest of the plugin.

Getting a new store to its first invoice

A document builder with dozens of settings is a lot to face on install. So the first run is a two-step onboarding that ends with the store reviewing its first invoice. After that, a guided tour walks through the builder, and the overview page gives quick actions, tips, and a help menu. I built the onboarding, the builder tour, and most of the overview page. The goal of all three is the same: get from install to a correct document without reading the docs.

Invoices that match how the order was paid

Two document problems came from real store setups, not the builder. Credit notes reused the invoice path, so they printed the whole order instead of the refund. I classified every refund into one of ten cases so the credit note shows only what was refunded and its totals always reconcile - see the credit note case study. Stores taking deposits had a similar gap. Four deposit plugins each store deposits and balances differently, so I extended the existing provider layer to cover them and made every invoice resolve to the parent order - see the deposit plugins case study. Both were later removed from the free WordPress.org build of the plugin, which suggests they moved to the Pro side.

Free and Pro in one interface

The free plugin and WowInvoice Pro share the same admin app. Free users need to see what Pro adds without the interface feeling locked. I built the Pro features page - hero, feature grid, showcase, and reviews - and the Pro tags and upgrade card that mark Pro-only options in the builder.

Conclusion

WowInvoice turns WooCommerce orders into invoices, packing slips, and delivery notes without the store owner assembling separate tools. My work was the part store owners touch: the builder and its document templates, click-to-edit in the live preview, the shared component kit, onboarding and the builder tour, the overview and Pro pages, and the credit-note and deposit handling on the documents.