setting up Article barcode scanning in Webapps STORE

Get Started
Functionality
Learning
Extension
Dev Tooling
APIs
Releases

How-to Guide

Author:

Fluent Commerce

Changed on:

5 Sept 2025

Key Points

Step by step to demonstrate how to add dc.scanner.barcode component into the Customer Collections page. A full reference can be found here

Steps

Setup fc.scanner.barcode

Copy the sample code fc.scanner.barcode from this link

Paste the code in between header component and List component:

Test the outcome

Refresh the customer collection screen in Fluent STORE, and use the keyboard to enter any unknown article ID. An error message should be displayed: No alt provided

Testing the outcome 2

Then enter an article ID that exists in your sandbox. The Customer collection screen should be displayed: No alt provided

setting up Article barcode scanning in Webapps STORE

Key Points

Steps

Setup fc.scanner.barcode

Paste the code in between header component and List component:

Test the outcome

Testing the outcome 2

Customer Collection via mobile fluent app

Related content

Supporting SKU with multiple barcodes during the picking

Control webapps STORE AND OMS UI by using roles and action in manifest

Fluent Commerce

Building Blocks

By Type

Helpful Resources

Quick Links

Setup fc.scanner.barcode

Paste the code in between header component and List component:

Test the outcome

Testing the outcome 2

Customer Collection via mobile fluent app