Features & Capabilities

The Quick Order Matrix is packed with features designed to make bulk ordering fast and efficient for B2B customers. This page provides a comprehensive overview of everything the matrix can do.

[IMAGE PLACEHOLDER: annotated-matrix.png]

Annotated screenshot highlighting all the key features: product images, variant titles, SKU codes, stock indicators, quantity inputs, price totals, and sticky footer

Matrix Table View

The core of the Quick Order Matrix is its spreadsheet-like table layout that displays all products and variants in one view.

Product Display

Product Thumbnails

• Each product shows a 60x60px thumbnail image
• Images are automatically optimized by Shopify's CDN
• Defaults to the product's featured image

Product Titles

• Main product name displayed prominently
• Clear typography for easy scanning

Variant Information

• Each variant appears as its own row
• Variant title shown below product name (e.g., "Small / Red", "Large / Blue")
• Products with only a default variant hide the variant title for cleaner display

SKU Display

SKU Codes

• Displayed in a monospaced font for easy reading
• Gray background to distinguish from other text
• Click-to-select functionality (entire SKU selects on click)
• Shows "N/A" if no SKU is assigned to the variant

Tip: SKU codes are essential for B2B customers who reorder using product codes. Make sure all your variants have SKUs assigned in Shopify.

Stock Management Integration

The Quick Order Matrix provides real-time stock status for each variant using a color-coded badge system.

Stock Status Indicators

[IMAGE PLACEHOLDER: stock-indicators.png]

Three stock status badges: green "In Stock", yellow "Low Stock (8)", and red "Out of Stock"

In Stock (Green Badge)

• Displayed when inventory quantity is above 10 units
• Customers can order any quantity up to available stock
• Quantity input is enabled

Low Stock (Yellow Badge)

• Displayed when inventory quantity is between 1 and 10 units
• Shows exact quantity remaining (e.g., "Low Stock (3)")
• Alerts customers to limited availability
• Quantity input is enabled

Out of Stock (Red Badge)

• Displayed when variant is not available or inventory is 0
• Quantity input is disabled (grayed out)
• Prevents customers from attempting to order unavailable items

Customization: The low stock threshold (10 units) can be adjusted. See the Customization Guide for details.

Bulk Ordering Capabilities

The Quick Order Matrix's primary feature is enabling customers to order multiple products simultaneously.

Quantity Input Fields

Number Inputs

• Clean, minimalist design
• Accepts only positive numbers
• Defaults to empty (no pre-filled zeros cluttering the view)
• Disabled automatically for out-of-stock items
• Mobile-friendly on touch devices

Real-Time Updates

• Totals recalculate instantly as you type
• No page reloads required
• Smooth, reactive experience with instant updates

Sticky Footer with Order Summary

[IMAGE PLACEHOLDER: sticky-footer.png]

Sticky footer at bottom of screen showing: "Total items: 47" and "Total value: $1,284.50" with blue "Add All to Cart" button

The sticky footer stays visible as you scroll, providing:

Total Items Count

• Shows sum of all quantities entered
• Updates in real-time as you modify quantities

Total Order Value

• Displays calculated total price for all items
• Formatted in your store's currency
• Updates instantly when quantities change

Add All to Cart Button

• Prominent blue button for easy access
• Disabled (grayed out) when no quantities are entered
• Shows "Adding..." loading state during submission
• Prevents double-clicks and duplicate submissions

Cart Integration

Bulk Add to Cart

When you click "Add All to Cart":

1. Validation - Verifies all quantities are valid numbers
2. Bulk Submission - Sends all items to Shopify's Cart API simultaneously
3. Loading State - Button shows "Adding..." with disabled state
4. Success - Automatically redirects to the cart page
5. Error Handling - Displays error message if something fails

How It Works:

• Uses Shopify's native /cart/add.js AJAX API
• No Shopify app required
• No additional fees or subscriptions
• Works with Shopify's standard cart system

Responsive Design

The Quick Order Matrix is optimized for different devices and screen sizes.

Desktop Experience

• Primary Use Case: Designed for desktop/laptop use where B2B ordering typically happens
• Wide table layout shows all columns clearly
• Hover effects on table rows for better scanning
• Comfortable click targets for inputs and buttons

Mobile Experience

[IMAGE PLACEHOLDER: mobile-view.png]

Mobile view showing horizontal scroll functionality with the table adapting to smaller screens

• Horizontal Scroll: Table scrolls sideways to fit on narrow screens
• Touch-friendly input fields with larger tap targets
• Sticky footer remains accessible
• Optimized for occasional mobile use

Note: The Quick Order Matrix is primarily designed for desktop use, as most B2B ordering happens on computers. Mobile support is functional but not the primary focus.

Performance Characteristics

Product Limit

200 Products Maximum

• Each collection can display up to 200 products in the matrix
• This limit balances catalog size with page performance
• All variants of those 200 products are shown (unlimited variants per product)

Why the Limit?

• Ensures fast page loads (typically 2 to 3 seconds)
• Maintains smooth scrolling and interaction
• Encourages logical organization into product categories/collections

For Larger Catalogs:

• Create multiple collections organized by category
• Example: "Electronics Wholesale", "Accessories Wholesale", "Apparel Wholesale"
• Customers can navigate between collections as needed

Future Enhancement: The full Matrix B2B theme will include advanced search that searches across ALL products in your store, regardless of pagination or collection limits.

Client-Side Reactivity

• No Page Reloads: All calculations happen instantly in the browser
• Fast Updates: Instant calculations with no page reloads
• Smooth Experience: No lag when entering quantities or viewing totals

What's NOT Included

To set proper expectations, the following features are not available in the free Quick Order Matrix:

❌ Product Search or Filtering

• No search by product name, SKU, or barcode
• No filtering by category, vendor, or product tags
• Use browser's Find function (Ctrl+F / Cmd+F) as a workaround
• Note: The full Matrix B2B theme will include search that queries ALL products, not just the current page

❌ Sorting

• Products display in collection order (set in Shopify admin)
• Cannot sort by name, price, SKU, or stock level in the matrix
• Arrange your collection order in Shopify to control display order

❌ CSV Import/Export

• No ability to import order quantities from spreadsheet
• No export of the matrix to Excel/CSV

❌ Product Comparison

• No side-by-side product comparison features
• No saved product lists or favorites

❌ Customer-Specific Pricing

• Shows standard product prices only
• No custom price lists per customer
• No Net 30 or payment terms

❌ Advanced B2B Features

• No minimum order quantities (MOQ)
• No tiered pricing
• No customer portal
• No approval workflows

Want These Features? The full Matrix B2B theme (coming soon) will include advanced search for 50,000+ item catalogs, customer-specific pricing, Net 30 payment terms, custom price lists, and more. Join the waitlist.

Feature Summary

Here's a quick reference of what the Quick Order Matrix includes:

Real-World Use Cases

The Quick Order Matrix excels in these scenarios:

Wholesale Reorders

• Customers who order the same products regularly
• Fast reordering by SKU or visual product recognition
• Perfect for "standing orders" or routine restocking

Small to Medium Catalogs

• Stores with up to 200 products per category
• When your entire catalog fits in one or a few collections
• Focused product lines or well-organized categories

Trade Shows or In-Person Ordering

• Sales reps can take orders on-site with a tablet
• Customers can see everything at once and order quickly
• Professional presentation

Showroom Ordering

• Retailers browsing your showroom or catalog
• Quick bulk ordering without clicking through individual products
• Streamlined B2B experience

Next Steps

Want to learn more about the Quick Order Matrix?

• How It Works - Understand the customer experience
• Customization - Customize colors, text, and styling
• Troubleshooting & FAQ - Common questions and solutions