Añadir un código de barras a la salida del PDF

Un código de barras es un patrón de datos que las máquinas pueden leer. Los clientes pueden escanear códigos de barras con un escáner de códigos de barras o con la cámara de su smartphone. La información de codificación, como los detalles del producto, los números de inventario o las direcciones URL del sitio web, puede resultar útil. Añadir códigos de barras le ayuda a capturar los datos fácilmente, mejora la experiencia del cliente y facilita una mejor administración y seguridad de los datos.

Puede crear un estilo para el código de barras. y utilizarlo para insertar un código de barras en un diseño de página. Puede aplicar el estilo a un código de barras de ejemplo en el diseño de página deseado.

Este tutorial le ayuda a añadir códigos de barras en la salida del PDF.

Pasos para generar un código de barras

Para generar un código de barras, realice los siguientes pasos:

Actualice el CSS de la plantilla para procesar un valor de código de barras

Modifique el archivo layout.css para procesar un código de barras durante la generación del PDF. Se admiten varios tipos de código de barras como qrcode y pdf417. Para obtener más información, vea Tipos de código de barras.

...
.barcode {
-ro-replacedelement: barcode;
-ro-barcode-type: code128;
-ro-barcode-size: 100%;
-ro-barcode-content: content();
object-fit: contain;
margin-top: 2mm;

}
...

Utilice el estilo CSS para generar el código de barras.

Puede generar el código de barras de diferentes maneras. Algunos de los ejemplos son los siguientes:

Ejemplo 1

Agregue un marcador de posición de código de barras en el encabezado de la plantilla y aplique el estilo:

Puede ver el código de barras al generar el PDF de salida mediante la plantilla, que incluye el diseño de página. Una vez realizados los pasos anteriores, puede generar la salida del PDF con un código de barras.

La siguiente captura de pantalla muestra un código de barras de muestra en una salida de PDF.

Ejemplo 2

Modifique el archivo Common.plt en la plantilla Básico para agregar un código de barras después del título del proyecto.

Para crear un código de barras para un número ISBN, agregue un número ISBN. A continuación, utilice el número ISBN para generar el código de barras.

...

  <div data-region="header">
    <p class="chapter-header"><span data-field="project-title" data-format="default">Project Title</span> </p>
    <p><span class="barcode">978-1-56619-909-4</span></p>
  </div>
}
...

Ejemplo 3

Para crear un código de barras utilizando los metadatos de asignación:

Utilice cualquier metadato presente en el elemento <topicmeta> de un mapa DITA para mostrarlo como código de barras. Asegúrese de utilizar la sintaxis XPath correcta. Por ejemplo, puede agregar un(a) <resourceid> en el(la) <topicmeta> de un mapa DITA.

En el ejemplo siguiente, el ID de recurso sirve como entrada principal para generar el código de barras.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE map PUBLIC "-//OASIS//DTD DITA Map//EN" "technicalContent/dtd/map.dtd">
<map id="GUID-3c330691-4dac-4020-904a-d2d6246aeeb1-en">
  <title>Barcode Sample</title>
  <topicmeta>
    <resourceid id="7a5bda1c-b1db-4fd8-8763-a731e2e8abba">
    </resourceid>
  </topicmeta>
  <topicref href="GUID-139f6c64-bea3-4f17-8b22-ee131557e249-en.dita" type="topic">
  </topicref>
</map>

Puede utilizar el ID de recurso en un diseño de página de la siguiente manera:

  <div data-region="header">
    <p class="chapter-header"><span data-field="project-title" data-format="default">Project Title</span> </p>
    <p><span class="barcode" data-field="metadata" data-format="default" data-subtype="//resourceid/@id">Resource ID (barcode)</span></p>
  </div>
}

Tipos de códigos de barras barcode-types

Algunos de los códigos de barras más utilizados son los siguientes: