Inside a Shopify Wallpaper Calculator Priced by Material and Size

Illustration of a patterned wallpaper roll with a pricing card turning a 255 by 260 cm wall into 7.80 square meters and a subtotal of 312.00, above four wallpaper sample rolls in different finishes

This wallpaper comes in four materials, and each one has its own price per square meter. That price sits in Shopify as an ordinary variant price. The calculator reads it.

This is a look inside the Wallpaper by Material calculator on our Shopify demo store. It's built with Appify Custom Product Options.

The shopper picks a material on the product page and types a width and a height. The calculator rounds the width up, works out the area, and multiplies it by the material's rate.

What it does

The shopper picks a material first, with the product's own Shopify variant buttons. Below that, the calculator takes a width and a height in centimeters, each with a minimum of 100. Then an Additional Products option lists a few extras the shopper can tick.

Wallpaper product page with Material buttons for 100% Fiberglass, Embossed Vinyl TNT, Wall Effect TNT and ECO Adhesive Fabric, then the calculator with width and height in centimeters, the extras for Fiberglass with White TA Primer ticked, and a price summary showing the effective width, height, area, subtotal, discount and total
Pick the material, then the size and the extras that fit it.

In plain words, the price is the rounded-up width times the height, in square meters, times the price of the chosen material. The preview opens at the minimum size, 100 by 100 cm.

Why a wallpaper calculator priced by material is hard to build

  • The rate has to follow the material. In many options apps, a material is a choice with a fixed amount added to the price. Here the material is a native Shopify variant, and its price is the rate per square meter that the total price formula multiplies by the area.
  • The billed width isn't the typed width. The formula rounds the width up to the next multiple of the material's width, then uses that number. A pricing variable holds the result, so every later formula reads the same figure.
  • Each material has its own width. The rounding changes with the material, so each one is billed in its own whole widths.
  • Extras depend on the material. A rule condition can read the Shopify variant option, so each material shows only the extras that suit it.
  • The shopper should see what is billed. The price summary lists the effective width, the height and the area before it shows a total.
  • The choices have to survive the order. The width, height and extras travel on one cart line. Shoppers can edit them in the cart, and reordering brings them back.

One price, worked out

Here's a wall in Wall Effect TNT, 255 cm wide and 260 cm high, with prices in dollars. Wall Effect TNT is priced at 40 a square meter.

  • Effective width: 255 cm is rounded up to 300 cm.
  • Area: 300 cm by 260 cm is 7.80 square meters.
  • Price: 7.80 square meters at 40 is 312.00.
  • Discount: the demo store applies a discount on top, so its summary total reads 280.80.
Price summary showing effective width 300 cm, height 260 cm, area 7.80 square meters, subtotal 312, a 10 percent discount of 31.20 and a total of 280.80
255 by 260 cm in Wall Effect TNT, as the demo prices it.

The shopper typed 255 and the summary shows 300. The area, and the price, follow the 300.

The design decisions

The variant price is the rate

The total price formula is the area times VAR("SHOPIFY.PRICE"), the price of the selected variant. The starting price is set to zero, so nothing is added before the formula runs.

Change a material's price in Shopify and every size follows it. There's no second price list to keep in step.

Shopify variants hold the materials. The calculator holds the size. You don't need a variant for every width and height, and you don't give up the native variant picker.

Rounding lives in two small variables

One variable rounds the width up with CEILING: the typed width divided by the material's width, rounded up, then multiplied back. A second turns that width and the height into square meters.

Splitting it this way keeps the total formula short. It also keeps each step easy to check. The formula editor has a Troubleshoot tab if a price ever looks off.

The Dimensions option adds no money itself

The width and height have a minimum of 100 cm and a rate of zero. They feed the variables and nothing else.

The shopper types centimeters. The summary shows the area in square meters, the unit the rate is set in.

Extras are rules on the Shopify option

Each extra has a price per choice. A Show value(s) if rule reads the Shopify Material option and decides which choices appear.

Two of the rules use a single condition. The Embossed Vinyl and Wall Effect rule uses Any logic with two, so either material shows its extras.

The summary tells the story in order

The price summary lists the effective width, the height, the area and the extras, then the subtotal, discounts and total.

What arrives with the order

The calculated price goes to checkout on one cart line, for the variant the shopper chose.

Cart properties carry the rounded width and the height in meters, plus the extras. The raw typed dimensions are left off, so the order shows what the printer needs.

Customers can tap Edit options in the cart to change the size without starting over. Later, Appify Reorder brings the order back with every choice filled in, where Shopify's own Buy again drops them.

Make it yours

Get this calculator

Ask Chat with AI to build it in your own words. For example:

"Build a wallpaper calculator with a width and a height in centimeters, each with a minimum of 100. Round the width up to the next multiple of the selected material's width. Price it as the area in square meters times the selected Shopify variant price. Show the effective width, height and area in the price summary."

The variants and their widths stay in Shopify. For how this fits Shopify's own variants, read product options vs variants for custom products.

FAQ

How do you price wallpaper by material on Shopify?

Make each material a variant and set its price per square meter. The calculator multiplies that price by the area the shopper's size works out to.

Do I need a variant for every size?

No. The variants hold the materials only. The width and height come from the calculator.

Can different materials show different extras?

Yes. Rules can read the Shopify variant option and show only the extras you set for that material.

Does the shopper see the rounded width?

Yes. The price summary shows the effective width and the area before the total.

Every wallpaper material, priced at its own rate.

Install Free on Shopify

Whatever you sell, however you price it · The last options app you'll shop for