# How Frame Up works with Shopify

How Frame Up reads your products, variants and images from Shopify, keeps every preview in sync as your catalog changes, and stays light on your storefront.

October 19, 2026 · https://frameup.app/guides/how-frame-up-works-with-shopify

**In short:** Frame Up reads your Shopify products as they are, including their images, variants and product types, and turns them into live previews with a few variant rules. It never changes your products, needs no theme code and stays in sync as your catalog changes. It’s Built for Shopify, and its interactive code loads after your page.

## Shopify stays the source of truth

Frame Up doesn’t keep a copy of your catalog to maintain. It reads what’s already in Shopify: the product image, the options and variants, and the product type. Its own settings, such as which frame “Natural Oak” means, live in the app, not on your products. Your titles, prices, variants and images stay exactly as you set them.

## No theme code to edit

You turn Frame Up on in your theme editor, under app embeds, and it appears on your product pages. It works with the theme you already have, and turning it off removes it from your storefront. There’s nothing to copy into your theme files and nothing to undo later.

## It reads your catalog as it is

- **The artwork** comes from a product image you choose, usually the first. On the Plus plan, each variant can use its own image instead.
- **Sizes and frames** come from your Shopify variants, written the way you already name them.
- **Custom options** work too with [OptionWise](https://optionwise.ai), our sister app, so a frame or mat offered as an add-on updates the preview like a variant does.
- **Product types** let you treat products differently, so originals and prints in the same store can use different frames.

## Variant rules

A variant rule tells Frame Up what an option means: that “Natural Oak” is an oak frame, that “50x70” is a size, that “White mat” adds a mat. One rule covers every product that uses that option, so a catalog of hundreds of products usually needs only a handful of rules.

Frame Up is fluent in metric and imperial. It detects the unit in each size automatically, whether you write “50 x 70 cm”, “500x700mm”, “16″ x 20″” or “8 1/2 x 11 in”, and it reads paper sizes like A4 and A3 too. If your sizes are bare numbers like “50x70”, you tell the rule once whether they’re centimeters or inches.

You can also say what a size measures: the image, the artwork, the frame opening or the outside of the frame. A rule can match an option by name or any option at all, which helps when different products name their options differently.

Here’s a print in three sizes and three frames, set up with one size rule and one rule per frame. Choose a combination to see the variant and the preview change together.

_The live example is on the page: https://frameup.app/guides/how-frame-up-works-with-shopify_

## Everything stays in sync

- **On the product page,** the preview follows the shopper’s choices as they make them, including the variant a page opens on.
- **When you edit a product,** for example changing its image or adding a size, Frame Up reflects the change instantly. New products get a preview automatically.
- **When you change a variant rule,** every product that uses it shows the change straight away.

## Light on your storefront

Frame Up is built to leave your store’s speed alone, and it carries Shopify’s Built for Shopify badge, which Shopify awards only to apps that meet its standards for performance, design and integration. In our testing it has no measurable effect on a product page’s Core Web Vitals, the speed and stability scores Google and Shopify use to rate page experience: Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS) and Interaction to Next Paint (INP).

- **Your page loads first.** Frame Up’s interactive code waits until your product page has finished loading before it downloads, so it never holds up your theme’s own content.
- **Nothing jumps.** The preview takes its place on the page as soon as the page appears, at its final size, and doesn’t move or resize after that.
- **No empty box.** Frame Up renders each product’s preview on our servers ahead of time, known as server-side rendering, so the finished picture is part of your page from the moment it loads. When the interactive 3D view is ready, it takes over in the same spot, looking exactly the same. The switch is invisible, and shoppers can move straight into the room or the close-up.

## Billing through Shopify

Every plan is billed through Shopify, on your usual Shopify bill, with a 10-day free trial. You can change your plan from the app in your Shopify admin. See [pricing](/pricing) for the plans.

## Questions

**Does Frame Up change my Shopify products?**
No. It reads your product images, variants and options, and keeps its settings separately. Your titles, prices, variants and images stay exactly as you set them.

**Do I need to edit my theme’s code?**
No. You turn Frame Up on in your theme editor’s app embeds, and it shows on your product pages. Turning it off removes it.

**Will Frame Up slow down my store?**
No. Frame Up has Shopify’s Built for Shopify badge, which includes meeting Shopify’s storefront performance standards, and in our testing it has no measurable effect on your Core Web Vitals. It waits until your page has finished loading before it starts, its preview never shifts your layout, and each product’s preview is rendered on our servers ahead of time, so it shows straight away until the interactive 3D view takes over.

**Does Frame Up work with custom options as well as variants?**
Yes. With [OptionWise](https://optionwise.ai), our sister app, Frame Up reads custom options too, so a frame or size chosen as an add-on updates the preview just like a variant does.

## Need a hand?

Wondering how Frame Up would read your products? Send us a product link and we’ll show you how your options map to frames and sizes. contact@frameup.app