Web App

Barcode Scanning & Scan Page

The scan page is your primary tool for fast product lookups, stock adjustments, and product editing. Scan a barcode, type a SKU, or use your phone camera to instantly pull up a product and start working.

Barcodes and scanning

How barcode lookup works

When you scan or type a barcode, Stokkap searches your synced products for an exact match in this order:

  1. SKU - checks for an exact SKU match
  2. GTIN - checks for an exact GTIN (barcode number) match

If a match is found, the product loads immediately. If no match is found, you'll see a "Not Found" screen with options to create a new product or link the barcode to an existing one.

What is a GTIN?

A GTIN (Global Trade Item Number) is the number encoded in a product's barcode. Common formats include:

  • EAN-13 - 13-digit European Article Number (most common worldwide)
  • EAN-8 - 8-digit compact version
  • UPC-A - 12-digit Universal Product Code (USA/Canada)
  • UPC-E - 6-digit compressed UPC

For a physical barcode to be scannable in Stokkap, the product's GTIN field must be set in WooCommerce. Stokkap uses the default WooCommerce GTIN input field (introduced in WooCommerce 9.2). When you sync your store, Stokkap pulls this value automatically.

If your products don't have GTINs set, you can still look them up by SKU - just type or scan the SKU instead.

GTIN values can only contain digits (0-9) and hyphens (-). Other characters are not allowed.

Three ways to scan

1. USB / Bluetooth barcode scanner (recommended)

Plug-and-play barcode scanners work like a keyboard - they "type" the barcode number into the input field automatically.

  • Point your scanner at a product barcode
  • The scanner types the digits into the barcode input field
  • Stokkap auto-detects the input and looks up the product after a short pause (500ms of no typing)
  • No need to press Enter - the lookup happens automatically

Any USB or Bluetooth HID barcode scanner works. Budget models from brands like Netum, Inateck, or Tera are perfectly fine. Wireless Bluetooth scanners are ideal for warehouse use with a phone or tablet.

Supported barcode formats: EAN-13, EAN-8, UPC-A, UPC-E, Code 128, Code 39, Code 93, Interleaved 2 of 5.

2. Mobile camera

Use your phone or tablet's camera to scan barcodes directly - no additional hardware needed.

  1. Tap the camera icon next to the barcode input
  2. Point your camera at the barcode
  3. Hold steady - Stokkap requires 3 consistent reads to confirm the barcode (prevents misreads)
  4. On successful scan, the camera minimises and the product loads
  5. Tap the camera indicator to expand it again for the next scan

Camera tips:

  • Use the flip button to switch between front and rear cameras
  • Good lighting helps - avoid scanning in very dark areas
  • Hold the barcode roughly 15-30cm from the camera
  • The camera auto-stops after 60 seconds when minimised to save battery

Audio and haptic feedback:

  • Success: Short high-pitched tone + vibration pulse
  • Error: Low-pitched tone + double vibration pulse

3. Manual input

Type a barcode number or SKU directly into the input field and press Enter (or tap the search button). This is useful when the physical barcode is damaged or unreadable, or when you want to look up a product by its SKU.

SKUs containing forward slashes (e.g. 1903/NG/3) are fully supported.

If you're working in the WordPress admin, you can also use the Product Lookup modal for quick barcode scanning without leaving the page you're on.

Product information

When a product is found, the scan page shows:

  • Product image - tap to open full-size lightbox
  • Product name
  • Product ID - the WooCommerce product ID
  • Type badge - Simple, Variable, or Variation
  • Status badge - Published, Draft, or Private (Enabled/Disabled for variations)
  • Stokkap badge - shown when the product is managed by Stokkap
  • SKU and GTIN - editable if you have permission
  • Prices - regular price, sale price, and cost price
  • Stock breakdown - per-location stock for Stokkap-managed products, or total stock for WooCommerce-managed products

Variable products

Variable products (products with variations like size or colour) don't hold stock themselves. When you scan a variable product, you'll see a message to view the product page where you can manage individual variations. To manage stock, scan the specific variation's barcode instead.

Stock management

Stokkap-managed products (per-location stock)

Products managed by Stokkap track stock at each location. The stock display shows locations grouped by type, with a total at the top.

Adjusting stock:

  • Use the + and - buttons to increment or decrement stock at a specific location
  • Change the number between the buttons to adjust by more than 1 (e.g. set to 5, then tap + to add 5)
  • Use the Set input to set stock to an exact number at that location

Adding a location:

  • Tap + Add Location to assign the product to a new location
  • Select the location type and specific location
  • Enter the initial stock quantity

WooCommerce-managed products (simple stock)

Products not managed by Stokkap show a simple stock control with the same +/- buttons and Set input, but without location breakdown.

Enable / disable stock management

  • Enable Stock Management - turns on WooCommerce's stock tracking, allowing you to manage quantity
  • Disable Stock Management - turns off quantity tracking. The product uses a simple stock status (In Stock / Out of Stock / On Backorder) instead

Enable / disable Stokkap

  • Enable Stokkap - converts a WooCommerce-managed product to per-location stock tracking. You'll be prompted to allocate the existing stock across your locations
  • Disable Stokkap - converts back to simple WooCommerce stock. The total across all locations becomes the new stock quantity

Stock adjustments require the Stock Edit permission. Without it, you can still view stock levels but the adjustment controls are hidden.

Editing products

Inline editing

With the Products Edit permission, the SKU, GTIN, and price fields on the product card are directly editable. A Save button appears when you make changes. Only the fields you actually changed are sent to WooCommerce.

Status toggle

Click the status badge to change a product's status:

Product TypeOptions
Simple / VariablePublished, Draft, Private
VariationEnabled (Published), Disabled (Private)

Weight and dimensions

Expand the Weight & Dimensions accordion to set weight, length, width, and height. Values are displayed with your store's configured units (e.g. kg, lbs, cm, in). This section is collapsed by default since these fields are edited less frequently.

Excerpt and description

Expand the description sections to edit product content:

Product TypeAvailable Sections
SimpleExcerpt + Description
VariableExcerpt + Description
VariationVariation Description, Parent Excerpt, Parent Description

Descriptions are lazy-loaded - they're only fetched from WooCommerce when you expand the section, keeping the page fast.

The editor supports visual mode (formatted text with bold, italic, lists, and links) and HTML mode (tap the code button to toggle). A Save button appears when content has changed.

For variations, you can edit both the variation's own description and the parent product's excerpt/description. Parent sections are labelled to make this clear.

All product editing features (SKU, GTIN, prices, status, weight/dimensions, descriptions) require the Products Edit permission. Without it, these fields display as read-only.

Creating products

When you scan a barcode that doesn't match any product, the "Not Found" screen offers several options:

Create simple product

  1. The scanned barcode is pre-filled - choose whether it's a GTIN or SKU using the toggle
  2. Enter the product name (required)
  3. Optionally set SKU, GTIN, and prices
  4. Check Create as Draft if you don't want the product visible in your shop yet
  5. Tap Create - the product is created in WooCommerce and loaded on the scan page immediately

Add variation to existing product

A step-by-step wizard for adding a new variation to an existing variable product:

  1. Search parent - find the variable product this variation belongs to
  2. Link barcode - assign the scanned barcode as the variation's GTIN or SKU
  3. Set prices - optionally set regular, sale, and cost prices (a reference table shows existing variation prices for guidance)
  4. Select attributes - pick attribute values (e.g. colour: Red, size: Large) from the parent's defined attributes. You can also add new attribute values if needed

Link barcode to existing product

If the product already exists but doesn't have a barcode assigned:

  1. Search for the product by name or SKU
  2. The scanned barcode is assigned to the product's GTIN (or SKU) field
  3. Future scans of this barcode will find the product immediately

Conflict detection

Stokkap uses optimistic locking to prevent data loss when multiple people (or WooCommerce webhooks) modify the same product at the same time.

  • When you load a product, Stokkap records when it was last modified
  • When you save changes, Stokkap checks if anyone else modified it in the meantime
  • If a conflict is detected, you'll see a prompt to reload with the latest data
  • Tap Reload to get the fresh data, then make your changes again

This prevents situations where a stock update from an incoming order gets accidentally overwritten by your save.

Offline mode

If you lose internet connectivity, the scan page falls back to cached data:

  • Cached products - products you've previously scanned are stored locally and can still be viewed
  • Read-only - you can view product details but cannot adjust stock or edit fields
  • Uncached products - barcodes for products you haven't scanned before will show "Not Found"

Stock adjustments and edits require an active internet connection since all data is synced with WooCommerce in real-time.

Quick reference

Action How Permission
Look up productScan barcode, use camera, or type SKU/GTINProducts View
Adjust stockTap +/- or use SetStock Edit
Add location to productTap + Add LocationStock Edit
Enable/disable StokkapTap Enable/Disable Stokkap buttonStock Edit
Edit SKU/GTIN/pricesEdit fields on product card, tap SaveProducts Edit
Change product statusTap status badge dropdownProducts Edit
Edit weight/dimensionsExpand accordion, edit fields, tap SaveProducts Edit
Edit descriptionsExpand section, edit content, tap SaveProducts Edit
Create new productScan unknown barcode, tap Create ProductProducts Edit
Add variationScan unknown barcode, tap Add VariationProducts Edit
Back to documentation