Let shoppers step through print areas
Add the Print Areas panel so shoppers see one print area at a time with its own artwork preview, and step through every area in the product.
On a product with several print areas — a front and a back, six canvas panels, a mug with a wrap and a handle zone — shoppers often design one area and miss the rest. The Print Areas panel fixes that. It shows one print area at a time with a preview of that area's own artwork, and prev/next buttons that walk the whole product in order.
Stepping past the last area of a view moves to the next view and switches the canvas with it, so shoppers never have to find the view switcher themselves.
The panel is off by default. Add it to a customizer interface, or place it anywhere on the page with a shortcode.
Before you start
- Your product has at least one print area. See set up print areas in the Product Builder.
- You know where you want the panel: inside the customizer's main bar, or somewhere else on the page.
- Products with a single print area gain little from this panel. It pays off from two areas up.
Add the panel to the customizer
The simplest option. The panel becomes a main-bar module, like Text or Images.
- Go to Chamevo → UI Composer and open the interface your products use.
- Open the Modules tab.
- Find Print Areas in Available Modules and click +, or drag it into Selected Modules.
- Drag it to the position you want in the bar.
- Click Save.
See configure the UI Composer for custom layouts for the rest of the interface builder.
Place the panel outside the customizer
Put the panel in your own page layout — beside the canvas, under the product summary, wherever it fits.
With a shortcode
Add this to any page or post that already contains the [chamevo] shortcode:
[chamevo_module type="print-areas"]
The panel does not work on its own. The customizer must be on the same page. See position modules and actions with shortcodes.
With Elementor
- Edit the page in Elementor.
- Drag the Chamevo Module widget where you want the panel.
- Set Module Type to Print Areas.
The Chamevo Product Customizer widget must also be on the page. See use Chamevo with Elementor.
Configure what the panel shows
All display options live in Chamevo → Settings → Features → Print Areas. They apply to every placement of the panel — the main bar, the shortcode, and the Elementor widget alike.
| Setting | Default | What it does |
|---|---|---|
| Show Preview | On | Shows a preview image of the print area's artwork. |
| Preview Size | 160 | Size of the preview box in pixels. Captured at double the size for retina screens. Minimum 40. |
| Show View Title | On | Shows the view the print area belongs to, above the area label. |
| Show Position Counter | On | Shows "2 / 5" between the prev and next buttons. |
| Loop Navigation | Off | Wraps from the last area back to the first instead of disabling the buttons at the ends. |
| Show Element Count | On | Shows how many elements the area contains, next to the badge. |
| Show Empty Badge | On | Shows whether the area already has artwork in it. |
| Show Output Dimensions | Off |
Click Save Changes after editing.
Which settings to change first
- Turn on Show Output Dimensions when shoppers need to know the physical print size to judge their artwork — signs, wall art, banners.
- Turn on Loop Navigation for products where every area matters equally and shoppers circle back often.
- Turn off Show Preview on products with many small areas, where a compact list beats a thumbnail grid.
- Leave Include Export-Only Areas off unless you have a reason. Export-only areas cannot be designed in, so stepping onto one only switches the view — it looks like a dead end to a shopper.
How the panel behaves
One sequence across the whole product. The panel walks every print area of every view in the order you created them: Front · Area 1, Front · Area 2, Back · Area 1, and so on. Crossing a view boundary switches the canvas view automatically.
It follows the canvas. When a shopper selects a print area another way — clicking its indicator on the canvas, for example — the panel moves to that entry. The panel reflects the active print area rather than competing with it.
Labels are positional. Areas are numbered per view: Area 1, Area 2. Print areas have no name, so the numbering follows their order in the product. Reordering print areas in the Product Builder renumbers them.
Previews show artwork only. Each preview is cropped to the print area and rendered on a transparent background. The product image, shared backgrounds, and other areas' content are left out, so a shopper sees exactly what they placed in that area. This is deliberately not a preview of the printed result — see understand print-ready exports for what actually gets printed.
Element counts skip shared backgrounds. An element that belongs to no print area — the product image itself, for instance — is not counted anywhere.
Locked views show a lock icon. Stepping there switches the view, but the canvas stays read-only. Turn on Hide Locked Views to skip them entirely.
Check your setup
- Open a product with two or more print areas on your storefront.
- Confirm the panel appears where you placed it.
- Click next repeatedly and confirm it walks every area, switching views at each boundary.
- Add artwork to one area and confirm its preview and badge update.
- On a product where one area is still blank, confirm the empty badge makes that obvious.
- Test on a phone. Most of your traffic is mobile, and a panel that works on desktop can be cramped on a small screen.
Troubleshooting
- The panel is empty and says the product has no print areas. The product genuinely has none, or every one is filtered out. Check the product in the Product Builder, then check whether Hide Locked Views is hiding them.
- The shortcode renders nothing. The
[chamevo]shortcode must be on the same page. The panel connects to a customizer; it cannot run alone. - An export-only area is missing. Expected. Turn on Include Export-Only Areas if you want it listed — but shoppers still cannot design in it.
- Stepping to an area switches the view but nothing becomes editable. That area is export-only, or its view is locked. Both are read-only by design.
- The preview does not match the printed file. It is not meant to. Previews show only the artwork in that area, without the product image or shared backgrounds.
- Changes to the settings do not show up. Save the settings, then clear any caching plugin. See fix caching issues hiding the product customizer.
Next steps
- Set up print areas in the Product Builder to add or resize the areas the panel steps through.
- Configure bleed zones and output dimensions so the dimensions shown in the panel match what your printer expects.
- Configure the UI Composer for custom layouts to place the panel alongside your other modules.
FAQ
Q: Do I have to use the Print Areas panel? A: No. It is off by default and print areas work without it. Add it when a product has several areas and shoppers keep leaving one blank.
Q: Can I configure the panel differently on two different pages? A: No. The ten options in Settings → Features → Print Areas apply store-wide, to every placement of the panel.
Q: Will shoppers see my export-only print areas? A: Not unless you turn on Include Export-Only Areas. Even then they cannot design in them — stepping onto one only switches the view.
Q: Does the preview show what will actually be printed? A: No. The preview shows only the artwork inside that print area, on a transparent background. It leaves out the product image and shared backgrounds so shoppers can see their own work clearly.