PWGermanShop for ProcessWire – Live Demo

[eutervogel]

The order detail page had become increasingly cluttered and unintuitive over time as more buttons and features were added, so I gave it a proper overhaul.

[eutervogel]

Hey everyone, the post about the product configurator went out way too early. Sorry about that! 😅

It’s just some minor UI cleanup needed. We'll have a working version up shortly.

Edited Wednesday at 02:21 PM by eutervogel

[howdytom]

@eutervogel  I am glad it wasn't me 😅. I was browsing through the demo shop's pages like crazy. 

[eutervogel]

Hi all,

a quick follow-up: the latest addition to the shop suite is now live - a generic product configurator with a visual engraving/label designer.

frontend: https://demoshop.mholte.de/produkt/fruehstuecksbrett-gravur/

backend: https://demoshop.mholte.de/admin/shop/configurator/?template=5

Try the product “Frühstücksbrett mit individueller Gravur” - a personalised oak cutting board. Pick a design, enter some text and choose a font. The main product image updates live, and the finished artwork is frozen onto the order as a proof image for the workshop.

The options are completely data-driven - no code required. Shop operators can create select, radio, checkbox, text, number and area options, including surcharges, directly in the admin. A rule engine handles conditions such as: if option A is X, show, hide or add a surcharge to option B.

Price calculation and validation happen live on the product page, while the server remains authoritative: the price is recalculated and frozen when the product is added to the cart.

The engraving designer is optional per product. Each design can have its own image and text area, which the shop operator positions visually in the backend - including moving, resizing and rotating it. On the storefront, the selected design, the customer’s text and the chosen font are combined into a live preview. During checkout, the finished PNG is frozen and attached to the order, the confirmation email and the customer’s account view.

Area pricing is supported as well: the operator enters the price per m², the customer enters the dimensions in cm, and the conversion happens automatically.

The easiest way to understand it is probably to simply have a look around the backend and try it out.

If you want to create a configurator product yourself, just create a normal product and tick “Configurator product”. It will then appear under Shop → Configurator. Don’t forget to select a tax rate - I’ll make that field mandatory soon.

Feedback is very welcome!

Cheers,
Martin

[eutervogel]

I've added some new products to the category "Individuelles und nach Maß" to show off a bit more of what the configurator is capable of. 

[eutervogel]

Configurator update: per‑m² pricing, oval engraving areas, multi‑line text

A few more improvements to the product configurator since last time - all live on the demo shop if you want to click through them.

Per‑m² surcharges. Value options can now carry a surcharge per square meter, not just a flat amount or a percentage. So a made‑to‑measure roller blind can charge, say, +10 €/m² for a blackout fabric — the surcharge scales with the size the customer enters, instead of being the same for a tiny window and a patio door. The live price reflects it instantly, and the server recalculates it bindingly at add‑to‑cart.
Try it: the Rollo nach Maß product, "Anthrazit (Verdunklung)" fabric.

Oval / elliptical engraving areas. The engraving designer used to map text onto rectangular areas only. Text boxes can now be ellipses: the preview clips to the arc and shrinks the text to fit the curve, so an oval plaque or a round pendant uses its real usable area without running into the border.

Multi‑line engraving. The customer's engraving field is now a proper multi‑line text area, so names, dates and short dedications can be laid out over several lines and the live preview and the final proof image render them exactly the same.

As always the whole thing is data‑driven and operator‑configurable. No code per product.