The Banner demo prices a banner from its area in square feet. Print sides and hem choices are added on top, and they grow with the size of the banner too. A button opens a design canvas set to the banner's real size. It runs on Appify Custom Product Options.
A 4ft x 8ft banner printed on both sides, with hem and grommets every 2ft, works out to 32 square feet. This article shows how each part of the price is built and why it is set up this way.
What does the Banner calculator do?
The customer picks landscape or portrait, single or double-sided print, and a size. They choose a quantity and a hem style, then press Design Banner to open the design canvas.
The product's own price acts as the rate for one square foot. Every size, side and hem choice builds on that.
Why is a banner price hard to build, and how is it handled?
- The price follows the size, not a fixed amount per size. The size buttons carry the banner's area, and a pricing variable multiplies that area by the product price. Basic options apps put one fixed amount on each choice. Here a bigger banner costs more without anyone typing a new price.
- The extras scale with the banner. Printing on both sides costs more on a 5ft x 10ft banner than on a 2ft x 4ft one. The Double choice and the hem choices read the same area, so each extra grows with the size.
- Some extras are flat. A pole pocket does not depend on size, so it carries a plain amount. Each choice holds its own price on the choice, whether that is a formula or a number.
- Custom sizes need fields only some customers use. Width and height boxes appear when the customer picks Custom. A hidden option is left out of the price, so a preset size never picks up a typed size.
- The design surface has to match the product. Most options apps stop at the form. In this calculator the Product Designer opens at the size the customer chose, in the orientation they chose, with a back side only when they picked Double.
- The configuration survives the order. Every choice goes to the cart and the order. The customer can change them from the cart with Edit options.
How is one price worked out?
Take the 4ft x 8ft size, printed on both sides, with Hem & Grommets Every 2ft. The size choice holds the area, 32 square feet, and each line below is worked from it.
| Line | Working | Result |
|---|---|---|
| Base price | 32 square feet at 5.25 | 168.00 |
| Double-sided print | 32 square feet at 2.50 | 80.00 |
| Hem & grommets every 2ft | 32 square feet at 1.25 | 40.00 |
| Total | The three lines added together | 288.00 |
The price summary under the calculator shows the same three lines and the total, so the customer sees what each choice adds.
Pick Single and the middle line is zero. Pick a smaller size and all three lines shrink together, since they share one area. The default 2ft x 4ft banner, single sided with no hem, comes to 42.00.
What are the design decisions behind it?
The price is an area, not a table
There is no rate sheet here. The base price is the size choice multiplied by the product price. The product price is the one number a merchant changes when the rate per square foot moves.
Size buttons that hold an area
Each size button stands for a number of square feet: 8 for 2ft x 4ft, 18 for 3ft x 6ft, 32 for 4ft x 8ft and so on. The label the customer reads is the size. The number behind it is what the pricing uses.
Custom multiplies the typed boxes
The Custom button takes its value from the typed width times the typed height, both in feet. The boxes use a Show if rule that only reveals them when the size is Custom.
Extras priced from the same area
Double-sided print and the hem choices each carry a formula that reads the size choice. Single and No Hem, No Grommets cost nothing. Pole Pockets carry a flat amount. Because the extras read the area, a merchant never maintains a separate price per size for each one.
Orientation is a plain choice
Landscape and Portrait do not change the price. They turn the design canvas, and they travel with the order as a choice the customer made.
Canvas bindings tie the designer to the options
The canvas bindings link three options to the Product Designer. The size choice sets the artboard through a per-choice size chart, so a 4ft x 8ft banner opens as a 4ft x 8ft canvas. Orientation turns it. Print Sides shows the back side only for Double.
What arrives with the order?
The cart line carries the orientation, print sides, size, hem choice and quantity. The same line appears in the Orders tab with its options.
When a customer saves a design, it comes with the order. The proof, the print-ready file and the rest are on the order's Design Files page. The production output guide lists what each file is for.
A customer who wants a bigger banner taps Edit options in the cart. Their choices reopen filled in. The guide to editing in the cart has the setup.
How can you make it yours?
- Add a material choice. Vinyl, mesh or fabric can each carry their own rate per square foot, and the extras keep following the area.
- Add quantity discounts. Price each can drop as the count goes up. The tiered and volume pricing guide shows the options, including breaks that depend on size.
- Set a minimum price. A floor keeps the smallest orders worth taking. The minimum price guide covers a floor.
- Sell more than banners. The same app can run your stickers, wallpaper and signs. See how to run a print shop that sells stickers, wallpaper, signs and banners from one Shopify store. For signs priced by material and sides, see how to price custom signs.
How do you get this calculator?
Describe it to Chat with AI and check what it builds. A starting prompt:
Build a banner calculator. Orientation buttons: landscape and portrait. Print sides as two picture swatches, single and double. Size buttons 2 x 4, 3 x 6, 3 x 8, 4 x 8, 4 x 10 and 5 x 10 feet, plus Custom with width and height fields in feet that only show for Custom. Price the banner as its area in square feet times the product price. Double-sided adds a charge per square foot. Hem choices: no hem, hem only, hem and grommets every 2 feet, and pole pockets at a flat amount. A Design Banner button that opens the Product Designer with the artboard set to the chosen size and orientation, and the back side shown only for double.
Attach your own price list and the numbers come from it. To see how the whole banner shop fits together, read how to sell custom banners with instant pricing on Shopify.
FAQ
How is the Banner price calculated?
The base price is the banner's area in square feet times the product price. Print sides and hem choices add their own lines, worked from the same area.
Can customers type their own size?
Yes. Choosing Custom opens width and height boxes, in feet, and the price comes from the area they make.
Does double-sided print change the price?
Yes. Double adds a charge for every square foot of the banner, and it switches on the back side in the Product Designer.
Does the design canvas match the banner size?
For the preset sizes, yes. Each size choice sets the artboard, and orientation turns it.
Can a customer change the hem after adding to the cart?
Yes. Edit options on the cart line reopens the calculator with their choices filled in.
Every banner, priced and sized to its design.
Whatever you sell, however you price it · The last options app you'll shop for