Area Calculator - New edition!

Product Configurator / Area Calculation – New Edition

This article is a demonstration model. It does not sell anything; it shows what the plugin's new interface can do – in a single configuration that deliberately includes every field type and every calculation mode at least once. Everything you see on the right was set up in the Shopware back end. Without a single line of code.

Everything in one place

Assembling, calculating, defining dependencies – three separate screens until now, one workplace from now on. On the left the options of your shop, in the middle the configuration, on the right the settings of the selected field. The classic tabs remain untouched and reachable; you can switch back at any time.

The price calculates along – and shows its working

Every entry takes effect immediately. Below each amount it says how it came about: „Width × €3.20“, „× perimeter (width × 2 + height × 2)“ or, with a condition, „If width > 2,500: width ÷ 1,000 × 4 × €1.00, otherwise: …“. Your customer sees not only what they pay but why. That prevents questions before they arise.

Build formulas instead of typing them

The formula builder assembles calculations from building blocks: dimensions, option prices, quantity, intermediate results, brackets, basic arithmetic and functions. Conditions are possible too – if the width exceeds 2.50 m, calculate differently. Each step is restated below in a readable sentence so it stays visible what the formula does. A test area with freely chosen values shows the result before anything goes live.

Fourteen calculation modes per option value

Not every surcharge is a fixed amount. Available are, among others: add, subtract, percent of the result, times the result, times the perimeter, times the width, times the height, times double the width or height, times the girth from width, height and depth, times the value entered – or a formula of your own. The chosen mode appears in the shop below the price.

Dependencies between fields

Fields can be shown and hidden, locked or made mandatory depending on other selections. What is hidden is neither calculated nor ordered. This way the configurator guides customers through their decisions instead of presenting all of them at once.

The field types in this demonstration

• Dimensions and calculation – width, height and quantity with minimum and maximum values, step size and unit
• Selection lists – classic as a dropdown, as buttons, or as an image selection with preview and magnifier
• Multiple choice – as ticks or as image tiles
• Numeric fields – to type in or as a slider
• Text fields – with character counter and a price per character
• File upload – with progress bar, permitted formats and a size limit

Tier prices, weight, multilingualism

Tiers apply either to the calculation or to a single option value – by quantity, by area or by number of items, and per customer group if required. The weight is carried along and may follow a formula of its own. All names and descriptions are held in translated form; the interface follows the language being worked in.

The summary

On the left it says at all times what has been chosen, what it costs and how much it weighs – line by line, with the calculation, subtotal, discount and final price. The same details travel into the basket and onto the order. The price is frozen in the process: if you change your configuration later, an existing order keeps its price.

Do try everything out – change the dimensions and the quantity, deselect variants and select them again, and watch how the price and the summary move along with you.