Come progettare etichette con codici a barre con un editor web

2026-09-22 pdf labels barcodes label merge browser based graphical layout editor google sheets addin microsoft excel addon electronic shelf labels esl barcode3 labels label editor

如何使用基于 Web 的编辑器设计条形码标签

你需要一个能够正确扫描、携带正确产品数据，并且外观足够整洁以适用于零售货架或运输线的标签。本指南将引导你在下一代标签打印系统中使用其基于浏览器的 Label Studio 设计出这样的标签。完成后，你将拥有一个包含条形码、文本字段和徽标或图形的标签布局，可直接打印或导出为 PDF/PNG。

无需本地安装。编辑器在浏览器中运行，标签系统支持零售、物流和制造场景中常见的 1D 和 2D 条形码格式。

前提条件

开始之前，请确保你具备以下条件：

LPSNG 访问权限：可以是 https://lpsng.rsj.de 上的云版本，也可以是运行在本地设备上的嵌入式版本。
现代 Web 浏览器：Chrome、Firefox、Edge 或 Safari，并启用 JavaScript。
基本的标签元素知识：了解标签上的条形码、文本字段、图像和形状是什么。
可选的示例数据：产品名称、SKU 或价格，用于测试字段如何填充。

设计标签不需要本地打印机。你可以导出 PDF 或 PNG，稍后再打印。

分步指南：在 LPSNG 中创建条形码标签

第 1 步：打开 Label Studio

第 2 步：创建新标签布局

开始一个新布局。你可以选择现有模板，也可以从空白画布开始。

在添加元素之前设置标签尺寸。定义：

标签的宽度和高度
边距
方向

将这些值与你的标签纸相匹配，可以避免后续的缩放问题。

第 3 步：添加条形码字段

向画布添加一个条形码字段。

选择与你的扫描环境相匹配的条形码类型。常见选择包括：

Code 128 用于物流和仓库标签
EAN-13 用于零售产品条形码
QR Code 用于移动扫描或营销标签
Data Matrix 用于小型组件或工业标记

配置条形码属性：

物理尺寸
旋转角度
是否在条码下方显示可读文本

保持条形码周围的静区完整。编辑器允许你控制放置位置，但最终打印必须保留足够的空白区域，以便扫描器能够读取条码。

第 4 步：添加产品数据文本字段

为产品名称、价格、SKU 或其他标签数据添加文本字段。

你可以手动输入值，也可以将字段链接到数据源，如 CSV 文件、Excel 文件或 Google Sheet。对于一个简单的 CSV 驱动标签，你的数据可能如下所示：

sku,product_name,price
4001234567890,Example Coffee 250g,12.49
4001234567891,Example Coffee 500g,19.99

将每个标签字段映射到匹配的列。当你批量打印时，LPSNG 替换会用数据源中的值替换占位符。

第 5 步：添加图像或徽标

如果标签需要公司徽标、产品图像或合规标志，请添加图像元素。

直接上传图像或从 URL 引用。保持图像分辨率与最终打印尺寸相匹配。低分辨率的徽标在屏幕上看起来可以接受，但打印时可能会模糊。

第 6 步：排列并预览标签

使用编辑器的对齐工具、网格和吸附选项，将条形码、文本和图像元素一致地定位。

定期检查预览。注意以下问题：

元素重叠
文本距离标签边缘过近
条形码可能对目标扫描器来说太小

第 7 步：保存、测试并打印或导出

保存布局。

打印之前，使用示例数据记录进行测试，确认字段正确填充，并且条形码值随每条记录而变化。

设计就绪后，可以直接从浏览器打印到连接的热敏打印机或标准打印机，也可以将标签导出为 PDF 或 PNG 文件以备后用。

验证你的标签设计

在屏幕上看起来正确的标签不一定能被扫描器读取。在投入全面打印之前，请验证设计。

使用内置预览以实际尺寸检查布局和间距。
打印测试标签或导出 PDF/PNG，然后用智能手机应用或生产扫描器扫描条形码。
如果你使用数据绑定，请使用多条数据记录进行测试。确认较长的产品名称、空字段和特殊字符不会破坏布局。
根据你的需求检查条形码符号体系。对于零售标签，如果适用，确保格式和数据结构符合 GS1 规范。

快速验证可以避免整批重印。

常见问题排查

条形码无法扫描

确认你为扫描器选择了正确的符号体系。
检查条形码周围的静区是否被截断。
提高对比度：在白色或非常浅的背景上使用黑色条。
尝试增加模块宽度或整体条形码尺寸。

文本或元素错位

使用对齐和吸附工具精确定位元素。
仔细检查标签尺寸是否与物理标签纸匹配。
将打印机配置的纸张尺寸与设计尺寸进行比较。

数据未正确填充

验证与数据源的连接，如 CSV、Excel 或 Google Sheets。
检查标签元素与数据列之间的字段映射。
查找可能需要编码或转义的特殊字符。

打印质量差

如果打印颗粒感强或模糊，调整打印机 DPI 设置。
为打印机类型使用正确的标签纸。
如果条形码出现污迹或褪色，清洁打印头。

编辑器行为异常

尝试使用不同的浏览器。
清除浏览器缓存并重新加载 Label Studio。

高级技巧与集成

一旦你有了可用的标签，就可以在不重建设计的情况下扩展工作流程。

Python 字段脚本：LPSNG 支持附加到标签字段的 Python 脚本块。这些脚本可以在打印前修改字段值，例如格式化日期或按条件选择值。一般模式是将脚本块附加到字段并转换其值：

# Example field script attached to a label field.
# Check the Python API documentation for the exact entry point.
def format_label_date(raw_date):
    return raw_date.replace("-", ".")

Web Service API：对于高容量或集成工作流程，LPSNG Web Service API 可以提交打印作业、将单个标签渲染为 PDF 或 PNG，并通过 OAuth2 处理身份验证。如果你是新手，请参阅什么是标签打印 API？初学者指南。
Google Sheets 和 Excel：使用 Google Sheets 插件或 Excel 文件作为批量打印的数据源。当产品数据已经存在于电子表格中时，这非常有用。
电子货架标签：如果相同的产品数据需要同时出现在物理标签和数字货架显示屏上，LPSNG 提供了跨媒体 ESL 解决方案。集成路径请参阅 ESL 绑定 API 教程：将标签连接到商品。

有关动态字段逻辑的更详细介绍，请参阅在 LPSNG 中使用 Python 脚本操作标签字段。

常见问题解答

LPSNG 支持哪些条形码格式？

LPSNG 支持广泛的 1D 和 2D 条形码格式，包括 Code 128、EAN-13、QR Code、Data Matrix 等。完整列表可在条形码格式文档中查看。

我可以在不编写任何代码的情况下设计标签吗？

可以。基于 Web 的 Label Studio 提供了可视化的拖放界面，用于设计带有条形码、文本、图像和形状的标签。基本的标签设计不需要编写代码。

如何直接从 Web 编辑器打印标签？

设计好标签后，你可以直接从浏览器打印到连接的热敏打印机或标准打印机。LPSNG 还支持生成 PDF 或 PNG 文件，以便稍后打印或分享。

是否可以在编辑器中使用我自己的数据源，例如 Excel 或 Google Sheets？

可以。LPSNG 与 Excel 文件和 Google Sheets 集成。你可以将标签字段链接到电子表格中的列，从而实现使用动态数据进行批量打印。

结论

在浏览器中设计条形码标签不需要桌面设计工具或复杂的渲染流程。使用下一代标签打印系统的 Label Studio，你可以创建布局、添加条形码和文本字段、绑定数据、预览结果，然后导出或打印。

从 https://lpsng.rsj.de 上的云版本开始，如果你偏好本地部署，也可以探索嵌入式版本。对于多用户团队或多设备环境，LPSNG 还提供企业级功能。

更多文档：

Come progettare etichette con codici a barre con un editor web