Skip to main content

​
What is the Upload Component?

The Upload Component lets customers bring their own photo to your product page, see it framed live, and order with full confidence — before they buy.
The Upload Component follows the same configuration structure as the Artwork Component. Options, sections, pricing, and conditional rules all work identically. The only difference is a single toggle covered below.
Here is what it looks like on your live store: Customer-facing upload product page — showing Upload Your Image button, frame selector, and mat options

​
Artwork Component vs Upload Component

Templates screen — Upload Component and Artwork Component side by side

​
Accessing the Upload Component

Templates screen — Artwork Component and Upload Component cards, Upload Component highlighted with Use button
  1. Open the LIVEARf app from your Shopify admin
  2. In the left sidebar, click Templates
  3. Find the Upload Component card and click Use
  4. Open the Basic Configuration tab

​
The Key Difference — Image Upload Toggle

This is the only thing that separates the Upload Component from the Artwork Component. Component header — Component Name, Image Upload toggle ON, Quick Setup Guide highlighted
Do not turn the Image Upload toggle OFF unless you intentionally want to show only a placeholder image. Without it, customers cannot upload their photo and the component loses its core purpose.

​
How Customers Experience It

When a customer lands on a product page using the Upload Component, they follow one of two paths:
This is the main intended flow:
  1. Customer arrives on the product page
  2. They click Upload Your Image and select a photo from their device
  3. Their photo appears immediately inside the frame preview
  4. They adjust size, frame style, and mat options
  5. The preview updates in real time with their photo inside the chosen frame
  6. They add to cart and place their order Upload Component — customer photo loaded, frame swatches and size options visible in the preview panel
This path gives customers full confidence in what they are ordering before they buy.

​
Configuration

The Upload Component is configured exactly the same way as the Artwork Component. Refer to the sections below for full instructions on each part. Upload Component — Basic Configuration tab open, options panel on the left, live Preview Product on the right
Set the Component Name, confirm Image Upload is ON, and set Component Status to ON.→ See Component Header Settings
Configure your Shopify-inherited options and the three default custom options — Frames, Mat Size, and Mat Colour.→ See Options Panel
Configure single or double mat spacing, mat styles, and mat colour swatches.→ See Mat Size & Colour
All eight pricing methods — Fixed, Surface Area, Perimeter, and Linear Unit across Standard and Predefined — are available here.→ See Pricing
Use WHEN / THEN rules to show, hide, or strikeout options based on customer selections.→ See Conditional Rules

​
Linking to Products

1

Enable the component

Turn Component Status ON and save all changes. The Link button only appears once the component is enabled.
2

Open the Link panel

Click Link in the top-right corner of the configuration screen.
3

Choose how to apply it

Click Link to confirm.
4

Verify

Go to LIVEARf → Components. Your component shows the number of linked products with a status of Active.

​
Tips for Upload Component Merchants

Set a high-quality placeholder image that showcases your best frame. Customers who browse before uploading convert better when the page already looks great.
Use conditional rules to hide frame styles that don’t suit certain sizes. This reduces confusion and prevents mismatched orders.
If an order comes through without a customer image attached, follow up immediately via the order notes in Shopify. Always check that the upload step completed before fulfilling.

​
What’s Next?

Frame Generator

Create 2D and 3D frame visuals from your own frame strip images.

Artwork Component

Set up framing options for your own pre-made artwork.