Ecommerce App
Browse, purchase, and manage products tied to your assets and systems — from physical parts and kits to digital apps and data subscriptions — with full order tracking and inquiry management built in.
🏪 Shop
The Shop is where customers browse and purchase products. It is organized into three sections displayed top to bottom on the page.
Featured Collections
Highlighted collections that have been marked as featured by an administrator. Each collection is displayed as a card with its name and cover image. Clicking a collection card opens its product list.
Collections
All non-featured collections available in the account. Each collection is displayed as a card with its name and cover image. Clicking a collection card opens its product list.
⚠️ Non-obvious: A product must be assigned to at least one collection — or marked as a Featured Product — to appear anywhere in the Shop. Products that exist in the catalog but are not assigned to a collection and are not featured will not be visible to customers.
Featured Products
Individual products marked as featured by an administrator, displayed as cards below the collections. Clicking a product card opens the product detail page.
⚠️ Non-obvious: The Shop only shows products that are set to Live on Site in the Products admin. If a product is not live, it will not appear even if it is assigned to a collection.
📦 Collection Products Page
Clicking a collection opens the Collection Products page, showing all products within that collection as cards.
What does each element do?
| Element | Description |
|---|---|
| Breadcrumb | Shop / [Collection Name] — click Shop to return |
| Product card | Displays product name and starting price |
| Product image | Cover image for the product |
Clicking a product card opens the Product Detail page.
🔍 Product Detail Page
The product detail page shows full information for a single product and is where customers add items to their cart.
What does each field mean?
| Field | Description |
|---|---|
| Product name | Name of the product displayed as the page heading |
| Description | Short description shown below the name |
| Type | Product category — Part, Asset, Data, App, etc. |
| Reference Number | The reference ID linking this product to the physical part, asset, or app |
| SKU | Stock keeping unit identifier for this product |
| Variant dropdowns | If the product has multiple variants (e.g., size, configuration), each variant appears as a labeled dropdown. Selecting a variant combination updates the price. |
| Quantity | Editable quantity field — defaults to 1 |
| Price | Price for the selected variant and quantity |
| + ADD TO CART | Adds the selected variant and quantity to the cart |
⚠️ Non-obvious: If a product has multiple variants, you must select an option in each variant dropdown before the price reflects your selection. Adding to cart without selecting all variants may result in a default selection being applied.
🛍️ Cart
The Cart page shows all items currently added and allows quantity adjustments before checkout.
Cart Table
What does each column mean?
| Column | Description |
|---|---|
| Product | Product thumbnail, name (as a clickable link back to the product page), SKU, and selected variant |
| Quantity | Editable quantity field per line item |
| Total | Line item total (price × quantity) |
| Action | 🔴 Remove button to delete the item from the cart |
Cart Summary and Actions
What does each element do?
| Element | Description |
|---|---|
| Subtotal | Sum of all line item totals |
| PRODUCT INQUIRY (blue button) | Opens the Inquiry flow to request a quote or send product questions without completing a purchase |
| CHECK OUT (blue button) | Proceeds to the checkout flow to complete the purchase |
⚠️ Non-obvious: The cart holds one variant selection per product at a time. If you add the same product with a different variant, the latest selection replaces the previous one. Add different products separately to keep them as distinct line items.
📋 Inquiry
The Inquiry flow allows customers to submit a product inquiry or request a quote without completing a full purchase. Accessed via the PRODUCT INQUIRY button in the cart.
Inquiry Page Layout
Left panel — Contact steps:
What does each field mean?
| Step | Field | Description |
|---|---|---|
| 1 — Your Email | Email Address | Pre-populated with your account email — read-only |
| Confirmation text | Confirms a receipt will be sent to this address | |
| CONTINUE button | Advances to the next step | |
| 2 — Additional Email | Additional Email | Secondary email address shown for reference |
Right panel — Order summary:
What does each element do?
| Element | Description |
|---|---|
| Product image and name | Each cart item listed with its image |
| Quantity | Per item quantity |
| SKU | Product SKU |
| Variant | Selected variant for each item |
| Subtotal | Sum of cart items |
| Shipping | Shown as FREE if no shipping charge applies |
| Total | Final total |
⚙️ Products (Admin)
The Products section is the administrator view for managing the product catalog. Accessed via Ecommerce → Products in the sidebar.
Products Dashboard Tiles
| Tile | Color | What It Shows |
|---|---|---|
| Live Products | 🟢 Green | Count of products currently set to Live on Site |
| Non-Live Products | 🟠 Orange | Count of products not yet published to the Shop |
| Collections | 🔵 Blue | Total number of collections in the account |
Products / Collections Tabs
| Tab | What It Shows |
|---|---|
| PRODUCTS | Full product catalog list |
| COLLECTIONS | All collections and their management options |
Product List — Columns
What does each column mean?
| Column | Description |
|---|---|
| Image | Product thumbnail or placeholder |
| Name | Product name |
| Product Type | Category of the product (e.g., Data, Part, Asset, App) |
| Reference Id | The reference ID linking the product to a physical or digital item |
| Details | Additional product details if available |
| Live | Toggle switch — blue = Live on Site (visible in Shop); gray = not live (hidden from Shop) |
| Action | ✏️ EDIT and 🗑️ DELETE buttons |
⚠️ Non-obvious: The Live on Site toggle controls Shop visibility instantly. Switching a product to not-live removes it from the Shop immediately without any confirmation dialog.
⚠️ Non-obvious: Deleting a product archives it rather than permanently erasing it, so that historical order records remain intact.
➕ Create / Edit Product — 3-Step Form
Products are created or updated through a 3-step form.
Step 1 — Name & Description
What does each field mean?
| Field | Description |
|---|---|
| Name | Product name as it will appear in the Shop |
| Description | Short marketing description |
| Details | Extended product details |
| Type | Product type — App, Part, or Asset |
| Reference Id | Auto-populated if App type is selected; manually entered for Part or Asset |
| Featured | Toggle to mark this product as a Featured Product in the Shop |
Step 2 — Create Prices (Variants)
Each row in the pricing step represents one purchasable variant of the product.
What does each field mean?
| Field | Description |
|---|---|
| Variant Name | The dimension being varied (e.g., Size, Color, Configuration) |
| Name | The specific option value (e.g., Small, Blue, Deluxe) |
| Type | One-time purchase or Recurring (subscription) |
| Price | The price for this variant |
| Billing Cycle | For recurring variants: Daily, Monthly, or Yearly |
| Trial Period Days | Number of free trial days before billing begins (recurring only) |
| Stock | Available inventory quantity for this variant |
⚠️ Non-obvious: If you need to change the price amount, billing cycle, or type (one-time vs. recurring) on an existing variant, the system deletes the old variant and creates a new one automatically. This is expected behavior — the product record is preserved.
Step 3 — Photos
Upload one or more product photos. These appear on the product detail page and in collection cards.
📋 Collections Tab — Actions
| Button | Function |
|---|---|
| CREATE NEW COLLECTION | Opens the 2-step collection creation form |
| EDIT | Opens the collection update form |
| VIEW | Opens the collection product list (read-only) |
| DELETE | Permanently deletes the collection (products are not deleted) |
Collection Creation — 2 Steps:
| Step | Fields |
|---|---|
| 1 — Title and Products | Collection name, Featured toggle, product selector (add/remove products from this collection) |
| 2 — Cover Image | Upload a cover image displayed on the Shop collection card |
📊 Orders
The Orders section provides a full view of all purchases, their payment status, and fulfillment progress. Accessed via Ecommerce → Orders in the sidebar.
Orders Dashboard Tiles
Three charts appear at the top of the Orders page.
Order Status
| Segment | Color | Meaning |
|---|---|---|
| Created | 🔵 Blue | Order placed but payment not yet confirmed |
| Paid | 🔴 Pink | Payment received — awaiting fulfillment |
| Fulfilled | 🟠 Orange | Order shipped or delivered |
Subscription Status — Shows subscription statuses from the payment system. Visible to administrators only when payment integration is enabled.
Payment Status — Shows payment transaction statuses. Visible to administrators only when payment integration is enabled.
Orders Tabs
| Tab | What It Shows |
|---|---|
| CREATED | Orders placed but not yet paid |
| PAID | Orders paid and ready to process |
| FULFILLED | Orders shipped or completed |
Orders Table — Columns (All Tabs)
What does each column mean?
| Column | Description |
|---|---|
| Order Id | System-generated unique order identifier |
| Created Date | Date and time the order was placed |
| Customer email address associated with the order | |
| Amount | Total order amount |
| Address | Shipping address provided at checkout |
| Order Type | Type of purchase |
Additional columns by tab:
| Tab | Extra Columns |
|---|---|
| CREATED | Admin may see a PAID button per row if payment integration is not enabled |
| PAID | Status dropdown (Ordered, Processed, Received, Shipped), Tracking Number, NOTIFY button |
| FULFILLED | Tracking Number |
PAID Tab — Fulfillment Controls
What do the controls do?
| Control | Description |
|---|---|
| Status dropdown | Change the internal fulfillment status: Ordered → Processed → Received → Shipped |
| Tracking Number | Displayed as N/A until a shipping tracking number is entered |
| 🔔 NOTIFY (blue button) | Sends a status notification email to the customer. When status is set to Shipped, this also records the tracking number and moves the order to the Fulfilled tab. |
⚠️ Non-obvious: Setting the status dropdown to Shipped and clicking NOTIFY is the action that moves an order from the PAID tab to the FULFILLED tab. Simply selecting Shipped without clicking NOTIFY does not advance the order.
⚠️ Non-obvious: For accounts where payment integration is disabled, new orders arrive in the CREATED tab with a PAID button visible on each row. An administrator must manually click this button to mark the order as paid and move it to the PAID tab.
Order Details Page
Clicking any order row opens the Order Details page showing the individual line items in that order.
What does each column mean?
| Column | Description |
|---|---|
| Product Name | Name of the purchased product |
| Type | Purchase type — Onetime or Subscription |
| Variant | The specific variant purchased |
| Quantity | Number of units ordered |
| Amount | Line item price |
| Status | Fulfillment or payment status for this line item |
| Error | Any error message associated with a failed payment or fulfillment attempt |
🔄 Workflows
Workflow 1 — Browse and Purchase a Product
- Open the Ecommerce app and click Shop in the sidebar
- Browse Featured Collections or Collections — click a collection card to see its products
- Click a product card to open the product detail page
- If the product has variants, select your options from the dropdown fields
- Set the Quantity field as needed
- Click + ADD TO CART
- Continue browsing or click the cart icon to proceed
- On the Cart page, review your items and adjust quantities if needed
- Click CHECK OUT to complete the purchase
✅ Result: The product is added to your order. On successful checkout, a confirmation email is sent to your account email and the order appears in the Orders section.
Workflow 2 — Submit a Product Inquiry
- Add the products you want to inquire about to your cart (follow Workflow 1 steps 1–8)
- On the Cart page, click PRODUCT INQUIRY instead of CHECK OUT
- Confirm your email address on the Inquiry page
- Review the order summary on the right panel — Subtotal, Shipping, and Total are shown
- Click CONTINUE to submit the inquiry
✅ Result: An inquiry is submitted to the account. You receive a receipt at your email address. No payment is taken — the inquiry is a request for a quote or follow-up communication.
Workflow 3 — Publish a New Product to the Shop (Admin)
- Open Ecommerce → Products in the sidebar
- Click ➕ in the Product List toolbar
- Step 1 — Name & Description: enter the product name, description, type, and reference ID. Toggle Featured on if this should appear in the Featured Products section. Click Next.
- Step 2 — Create Prices: add one or more variants with their names, prices, and billing type. Click Next.
- Step 3 — Photos: upload one or more product images. Click Save.
- Back in the Product List, find the new product and toggle the Live on Site switch to blue
- Assign the product to a collection via the Collections tab if it should appear under a category
✅ Result: The product is live in the Shop and visible to customers. It appears in the assigned collection and/or the Featured Products section if marked as featured.
Workflow 4 — Fulfill a Paid Order (Admin)
- Open Ecommerce → Orders in the sidebar
- Click the PAID tab to see all paid, unfulfilled orders
- Locate the order to fulfill
- Use the Status dropdown to update the internal fulfillment status as work progresses (Ordered → Processed → Received → Shipped)
- When the item has shipped, select Shipped from the Status dropdown, enter the courier Tracking Number, and click NOTIFY
✅ Result: The customer receives a shipping notification email with the tracking number, and the order moves to the FULFILLED tab.
📌 Products can also be created and updated in bulk using the Ingestion app. Three ingestion types are available for ecommerce data: Create Products, Update Product Prices, and Update Product Images. See the Ingestion documentation for details.
✅ Best Practices
- Set products Live on Site only when fully configured. A product becomes visible to all customers the moment the Live toggle is switched on. Ensure pricing, variants, images, and collection assignments are complete before making a product live.
- Assign every product to a collection. Products not assigned to any collection — and not marked as Featured — will not appear anywhere in the Shop, even if they are set to Live. Always check collection assignment when a product is live but not visible.
- Use variants to handle size, configuration, and pricing tiers in one product. Rather than creating separate products for each option, add multiple price rows in Step 2. Customers will see a dropdown to select their preference on the product detail page.
- Use the Inquiry flow for high-value or custom orders. The Product Inquiry option sends the cart contents to your team without processing payment. Use this path for custom quotes, bulk orders, or items that require manual pricing confirmation.
- Update fulfillment status in sequence. The status dropdown in the PAID tab (Ordered → Processed → Received → Shipped) sends a notification email to the customer at each step. Clicking NOTIFY on each status change triggers the email.
- Monitor Non-Live Products regularly. The orange Non-Live Products count on the Products dashboard can accumulate quickly. Review this list periodically to determine which products should be published, updated, or removed from the catalog.
💡 Tips & Shortcuts
| Tip | How |
|---|---|
| See which products are visible in the Shop | Check the Products list — items with a blue Live on Site toggle are visible to customers |
| Find all orders awaiting fulfillment | Go to Orders → PAID tab — every order there needs a status update or shipment action |
| Navigate back to the Shop from a collection | Click the Shop breadcrumb link at the top left of the collection page |
| See what a customer ordered in detail | Click any order row in any Orders tab to open the Order Details page |
| Confirm a product's reference number | Open the product detail page — the Reference Number field shows the linked part, asset, or app identifier |
🔗 Related Apps
- 🔩 Parts — Parts catalog and compliance tracking
- 📦 Inventory — Inventory levels for orderable products
- 💬 Quotes — Quote generation for custom orders