Ajout d’un code à barres à la sortie PDF

Un code à barres est un modèle de données que les machines peuvent lire. Les clients peuvent analyser les codes à barres à l’aide d’un scanner de codes à barres ou d’un appareil photo de leur smartphone. Il peut s’avérer utile de coder des informations telles que des détails de produit, des numéros de stock ou des URL de site web. L’ajout de codes à barres permet de capturer facilement les données, d’améliorer l’expérience client et de faciliter une meilleure gestion et sécurité des données.

Vous pouvez créer un style pour le code à barres. et l’utiliser pour insérer un code-barres dans une mise en page. Vous pouvez appliquer le style à un exemple de code à barres dans la mise en page souhaitée.

Ce tutoriel vous aide à ajouter des codes à barres dans la sortie PDF.

Procédure de génération d’un code à barres

Pour générer un code-barres, procédez comme suit :

Mettre à jour le CSS du modèle pour générer une valeur de code à barres

Modifiez la variable layout.css pour générer un code à barres pendant la génération du PDF. Divers types de codes à barres tels que "qrcode" et "pdf417" sont pris en charge. Pour plus d’informations, voir Types de codes à barres.

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

}
...

Utiliser le style CSS pour générer le code à barres

Vous pouvez générer le code à barres de différentes manières. Voici quelques exemples :

Exemple 1

Ajoutez un espace réservé de code-barres dans l’en-tête du modèle et appliquez le style :

Vous pouvez afficher le code à barres lors de la génération du PDF de sortie à l’aide du modèle, qui inclut la mise en page. Une fois que vous avez effectué les étapes précédentes, vous pouvez générer la sortie du PDF avec un code à barres.

La capture d’écran suivante affiche un exemple de code-barres dans une sortie PDF.

Exemple 2

Modifiez la variable Common.plt dans le fichier De base pour ajouter un code à barres après le titre du projet.

Pour créer un code-barres pour un numéro ISBN, ajoutez un numéro ISBN. Utilisez ensuite le numéro ISBN pour générer le code-barres.

...

  <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>
}
...

Exemple 3

Pour créer un code à barres à l’aide des métadonnées de mappage :

Utilisez les métadonnées figurant dans la variable <topicmeta> élément d’un mappage DITA à afficher en tant que code à barres. Assurez-vous d’utiliser le XPath correct. Par exemple, vous pouvez ajouter une <resourceid> dans le <topicmeta> d’un mappage DITA.

Dans l’exemple suivant, l’ID de ressource sert d’entrée principale pour générer le code à barres.

<?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>

Vous pouvez utiliser l’ID de ressource dans une mise en page comme suit :

  <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>
}

Types de codes à barres barcode-types

Voici quelques-uns des codes à barres les plus couramment utilisés :