StyleImprint Documentation

What Is StyleImprint?

StyleImprint is a Shopify app for fashion brands that adds structured, standardized product information to product pages. Rather than placing fabric, fit, and care details as plain text inside a product description, StyleImprint stores this data in a structured format and displays it through a branded widget on the storefront.

The information managed by StyleImprint includes:

• Fabric composition — primary material and any blend components, with percentages.
• Fit type — how the garment is cut (e.g., Slim fit, Oversized, Regular).
• Care instructions — displayed as internationally recognised care symbols.
• Model measurements — the height, chest, waist, and hip of the model shown in product photos.
• Size chart — a link or image shoppers can reference.
• Construction details — collar type, sleeve, closure, neckline, and other template-specific fields.
• Sustainability and origin data — material certifications, manufacturer, country of origin, and traceability fields.
• Occasion & styling — occasion tags (e.g., casual, formal, party) and additional style notes.

Installing the App

StyleImprint is installed through the Shopify App Store. Search for StyleImprint and install the app — on the listing page, clicking Install initiates the installation flow.

Shopify displays a permissions screen that lists the access the app requires — including products, metafields, and theme assets. Clicking Install app on that screen completes the installation and redirects you into the StyleImprint onboarding flow inside the Shopify admin.

First-Time Onboarding

The onboarding flow runs automatically the first time you open StyleImprint after installation. It consists of a Welcome page followed by four numbered steps:

App Installation → Welcome Page → Step 1 (Introduction) → Step 2 (Theme) → Step 3 (Profile) → Step 4 (First Imprint)

Welcome Page

The Welcome page is the first screen displayed after installation. It contains the StyleImprint logo, a product-enrichment illustration, and a large Next button.

Step 1 — Introduction

Step 1 presents a comparison of product pages before and after using StyleImprint. It highlights that setup takes only two minutes and that no storefront changes occur without your approval.

Step 2 — Theme Connection

This step guides you through connecting the StyleImprint block to your active Shopify theme.

1. Open your theme editor — Online Store → Edit theme.
2. Go to your product page template — pick Product and select Default product from the page dropdown.
3. Add the StyleImprint block — in the left section, click Add block → select the Apps tab → search StyleImprint Widget → Save.

Step 3 — Store Profile

This step asks three quick questions to personalise the app's recommendations. The progress bar shows three of four segments filled.

The answers are stored against the store and used to determine the personalised tip and imprint suggestion shown in Step 4. The Continue → button becomes active once all three questions have been answered. The ← Back button returns to Step 2.

Step 4 — First Imprint Suggestion

The app provides a personalised recommendation for your first imprint based on an automatic scan of your product catalog.

If the catalog analysis detects additional strong matches, they appear below the main suggestion card as small selectable pill buttons labelled "Also detected in your store." Clicking a pill switches the active suggestion to that category. When you click Create Imprint →, a store scan popup is displayed.

Once the scan is complete, clicking Save X Products saves the store profile and opens the Create Imprint Wizard on the Dashboard, with the suggested category and subcategory automatically pre-filled.

Low confidence — when the scan cannot determine a dominant category with enough confidence, the suggestion card is replaced by a two-column grid of broad category tiles: Ethnic Wear, Western Wear, Footwear, and Kids' Wear.

Clicking any tile saves the store profile and opens the Create Imprint Wizard with that category pre-selected. A "Skip — I'll explore on my own" link below the banner saves the store profile and navigates directly to the Dashboard without opening the wizard.

The Dashboard

The Dashboard is the central hub of StyleImprint, providing an overview of your store's imprinted products and access to management tools.

Summary Cards

Imprints Table

The Create Imprint Wizard

Clicking + Create Imprint opens a four-step modal that guides you through establishing a new category-based imprint.

Step 1 — Category Selection

Each card displays a category name and a short description. Available categories include Western Apparel, Ethnic Wear, Kids Wear, Footwear, Accessories, and Activewear. Clicking a card selects it, highlighted with a brand-coloured border. The Continue → button becomes active once a category is selected.

Step 2 — Subcategory Selection

Choose a specific template (e.g., T-Shirts, Dresses). These templates contain fixed fields relevant to the garment type. Each subcategory maps to a pre-built field template specific to that product type — a Shirts template includes collar type and sleeve length fields, while a Sarees template includes weave and border fields.

Step 3 — Store Scan

StyleImprint scans your Shopify catalog to find products matching your selected subcategory.

Once the scan completes, results are shown in three summary items:

Possible scan outcomes:

• No products found — no products matched the chosen subcategory. A back button returns you to Step 2 to choose a different subcategory, or you can add products manually in the editor later.

• Templates coming soon — the chosen subcategory template is not yet available; return to Step 2 and select a different subcategory.
• Scan failed — a temporary error occurred. A Retry button re-runs the scan.

The Save [N] products → button at the bottom advances to Step 4. The number shown reflects the count of matched products.

The Imprint Editor

The Imprint Editor opens after saving a new imprint, or by clicking the pencil icon on any row in the Dashboard table. The page title shows the category and subcategory in the format "[Category] › [Subcategory]" (e.g., "Men's Western › T-Shirts").

Products Table

Each field in a product row is directly editable without navigating away. Clicking a cell in the Fabric, Fit, Care, or Model column opens an inline editor for that field — a text input, a dropdown selector, or an icon picker, depending on the field type.

Mass Edit Toolbar

Select multiple products to apply a Fit type, Care preset, or Model to the entire selection simultaneously.

After selecting values from any combination of the three dropdowns, clicking Apply applies the selected data to the chosen products. To keep those changes, click Save All in the top-right corner of the table. To revert them, click Discard in the top-right corner instead.

Search Bar

A search bar sits above the products table. Typing any portion of a product title filters the visible rows in real time. The search operates on product titles only and resets when cleared.

Add Product Modal

Products not captured by the initial store scan can be added manually. The product picker is accessible from the toolbar via + Add product and opens a modal containing a search field and a scrollable list of products from the Shopify catalog.

Each product in the list shows its title and current imprint status. Checking a product's checkbox and clicking Add [N] products adds them to the current imprint group. The Cancel button closes the modal without changes.

The Product Detail Editor

The Product Detail Editor opens when you click the Edit button in the Actions column of a product row. It provides access to the full imprint data for a single product.

Fabric Composition

The Fabric section contains two fields for the primary material:

• Fabric name — a text input with an autocomplete dropdown populated from a curated list of textile materials (e.g., Cotton, Silk, Linen, Polyester, Wool, Elastane). Type freely or select from the list.
• Percentage (%) — a numeric input for the proportion of this fabric in the garment (e.g., 95).

An Add material control adds additional fabric and percentage pairs for multi-material garments. The total percentage across all fabric rows must equal exactly 100%; a validation warning is shown if it does not, and the Save button is disabled until the percentages are corrected.

Fit Type

The Fit Type field is a dropdown selector. The available options depend on the subcategory template.

Care Instructions

Care instructions are displayed on the storefront as internationally recognised textile care symbols. In the editor, each available preset is shown as a checkbox with its symbol icon and a text label (e.g., "Machine wash cold", "Do not bleach", "Tumble dry low", "Iron on low heat").

Model & Size Worn

The Model field is a dropdown that lists all models by avatar and name. It also contains a "No model" option for products where no model photography is used, and a "+ Add new model" option that opens the model popup.

When adding a new model you provide their Name, Height, Gender, Chest, Waist, and Hip measurements, and a photo avatar. Clicking Create model saves it.

Selecting a model assigns that model's measurement profile to this product. On the storefront, the widget displays the model's name along with their height, chest, waist, and hip measurements. The Size worn field is a plain text input that records the size the assigned model is wearing in the product photos (e.g., M, Large, 36).

Size Chart

The Size Chart section contains a type selector with three options:

• No size chart — no size chart is attached to this product.
• Upload image URL — a URL input appears; the linked image is displayed within the storefront widget.
• Link to a page — a URL input appears; a link to a size chart page is shown in the widget.

Construction Details

This collapsible section contains template-specific fields describing the physical construction of the garment. The fields shown depend on the product's subcategory template. For example:

• Shirts template — Collar type (Spread, Mandarin, Button-down), Sleeve type (Full, Half, Sleeveless), Closure (Button, Zip, Hook & bar), Neckline (Crew, V-neck, Round).
• Dresses template — Silhouette (A-line, Bodycon, Shift), Neckline, Sleeve type, Length (Mini, Midi, Maxi).

All fields in this section are optional.

Sustainability & Origin

The Sustainability & Origin section requires all information to be entered manually. All fields in this section are optional.

Occasion & Styling

• Occasion tags — multi-select checkboxes for occasions this garment suits (Casual, Formal, Festive, Wedding, Office, Party).
• Season — a dropdown: All seasons, Summer, Winter, Monsoon, Spring-Fall.
• Style notes — a free-text area for any additional styling guidance to present to shoppers.

Storefront Preview Widget

Located on the right side of the Product Detail Editor, this tool shows a real-time preview of the storefront widget as you edit data.

In the collapsed view, if there is additional content hidden to the left or right, you can click the chevron controls to view the remaining details such as product construction and fabric composition. Clicking View More + displays additional details such as Origin & Brand, Sustainability, Occasion & Style, and Style Notes.

In the expanded preview, you can scroll vertically within the widget to view additional details such as Care Instructions, Origin & Brand, Sustainability, Occasion & Style, and Style Notes.

CSV Import & Export

For stores with large catalogs, data can be managed via CSV files. Export an imprint group, edit it in Excel or Sheets, and import it back to update Shopify metafields in bulk.

Export CSV

The ↑ Export CSV button in the Imprint Editor toolbar downloads a CSV file for the current imprint group, named with the category and subcategory. The exported file contains the following columns:

Import CSV

The ↓ Import CSV button opens a file picker. The file must be saved in CSV format (not XLSX). Before importing, the following rules apply:

• The product_handle column must not be modified — it is the key used to identify which Shopify product each row corresponds to.
• No columns should be added or removed.
• fabric_blend and care_codes must remain valid JSON if edited (e.g., [{"name":"Elastane","pct":5}]).
• Empty cells indicate no data for that field — do not use placeholders like "N/A" or "none".

CSV Import Preview Modal

After a file is selected, the CSV Import Preview modal opens before any data is written. It displays every row from the CSV alongside a status label indicating what will happen to that product on import.

A conflict-resolution toggle at the top applies to all rows with Conflict and Not in table status:

• Skip (recommended) — existing complete data is preserved; CSV values for conflicted rows are not applied.
• Overwrite — CSV values replace the existing saved data for conflicted rows.

The Import [N] products button commits all non-skipped rows and writes the resulting data to Shopify metafields. No changes are made until this button is clicked.

Import Status Labels

Imprint Quality Score

This score measures how complete your product data is. Higher scores improve shopper trust and SEO.

How the score is calculated

A product with only Fabric and Fit filled scores 35 points (red). Adding Care and a Model brings it to 60 (orange). Adding Size worn and some Full Details fields pushes it above 70 (green).

Settings

The Settings page is accessible from the navigation menu on the left side of the StyleImprint app.

Widget Accent Colour

The widget accent colour controls the colour used for borders, highlights, and accent elements inside the StyleImprint storefront widget. The Settings page offers two ways to set it:

• A colour swatch that opens the browser's native colour picker.
• A hex input field where a specific hex code can be typed directly (e.g., #2C3E50).

Both controls update the same value. Clicking Save settings writes the colour to the store configuration and syncs it to a Shopify metafield. The storefront widget reads this metafield and applies the colour on the next page load. The Storefront Preview inside the Product Detail Editor also reflects the current saved colour, so you can check the impact of a change before saving.

How Imprints Appear on the Storefront

Once saved, data is written to the styleimprint namespace in Shopify metafields. The theme block automatically renders this data in a clean, responsive layout.

On the storefront, the StyleImprint widget appears in the position where you added the StyleImprint Widget block in your theme.