Matrix B2B

Customization Guide

The Quick Order Matrix can be customized using the Shopify Theme Editor. This guide covers the customization options available without needing to edit code.

Using the Theme Editor

The Quick Order Matrix includes a setting that you can adjust directly in the Shopify Theme Editor.

Accessing Section Settings

  1. Navigate to your collection page that uses the Quick Order Matrix
  2. Click "Customize" in the top right (or go to Online Store → Themes → Customize)
  3. Click on the Quick Order Matrix section in the preview
  4. View settings in the right sidebar

[IMAGE PLACEHOLDER: theme-editor-settings.png]

Screenshot showing the Theme Editor with Quick Order Matrix section selected and settings visible in the sidebar

Available Settings

Show SKU

Location: Section Settings → Show SKU

Type: Checkbox

Default: ✅ Checked (enabled)

Options:

  • ✅ Checked - SKU column is visible in the table
  • ❌ Unchecked - SKU column is hidden from the table

Use Case: Uncheck this option if your products don't use SKU codes or you want a cleaner table layout without the SKU column.

What it affects:

  • When enabled: The table displays a "SKU" column showing each variant's SKU code
  • When disabled: The SKU column is completely hidden from the table

Advanced Customization (Requires Developer)

To customize other aspects of the Quick Order Matrix beyond the Show SKU setting, you'll need to edit the theme code. Common customizations that require developer work include:

  • Changing text labels (column headers, button text, stock status labels)
  • Modifying colors (stock badges, buttons, table styling)
  • Adjusting layout (spacing, image sizes, footer position)
  • Changing the stock threshold (currently hardcoded to 10 units)
  • Adding custom columns (Vendor, Weight, Custom Fields)
  • Changing the product limit (currently 200)
  • Adding product search or filtering
  • Custom JavaScript functionality
  • Integration with third-party apps

For these advanced customizations, see the Troubleshooting & FAQ page for guidance on when to hire a developer.

Testing Your Customization

After toggling the Show SKU setting in the Theme Editor:

  1. Preview Changes - Use the preview pane to see whether the SKU column appears or disappears
  2. Test on Mobile - Check how the table looks on mobile devices using the device preview
  3. Save - Click "Save" when you're satisfied with the change

Reverting Changes

To revert to the default setting (Show SKU enabled):

  1. In Theme Editor, click on the Quick Order Matrix section
  2. Check the "Show SKU" checkbox to restore the default behavior

Next Steps

Previous
How It Works
Next
Troubleshooting & FAQ