Skip to content

Step 8: Add the full lab panel

One number is rarely enough. A table gives you the whole panel.

  1. Add a Table layer and set its Layer description to Lab results.
  2. Drag it into a block just below the THC line, a little narrower than the label: X: 10% – 90%, Y: 73% – 86%.
  3. Set Font Size to 7 and Resize Strategy to Shrink Text.
  4. Replace the Value template with:
<table><tbody>
{% for key in ['totalTHC', 'totalCBD', 'CBG', 'totalTerpenes'] %}
{% set entry = package.metadata.indexedLabResults[key] %}
<tr><td><b>{{ entry.name }}</b></td><td>{{ entry.value }} {{ entry.unit }}</td></tr>
{% endfor %}
</tbody></table>

One element left: the state warning.

A table element takes HTML. T3 reads the first <table> it finds and lays the cells out for you, so you build rows with a loop rather than by hand.

Listing the keys rather than looping over everything is deliberate: it puts THC first and keeps a result you did not expect from appearing on a printed label.

Tables draw no lines of their own. The grid you saw while Draw borders was on came from the border overlay, not the table.

Labels with the full lab panel

Printed PDF • Layout JSON

Behind the scenes 
{
  "name": "Tutorial label",
  "labelContentLayoutElements": [
    {
      "description": "Tag barcode",
      "elementType": "CODE128_BARCODE",
      "xStartFraction": 0.05,
      "xEndFraction": 0.95,
      "yStartFraction": 0.46,
      "yEndFraction": 0.66,
      "valueTemplate": "{{ package.label }}"
    },
    {
      "description": "Tag number",
      "elementType": "TEXT",
      "xStartFraction": 0.05,
      "xEndFraction": 0.95,
      "yStartFraction": 0.38,
      "yEndFraction": 0.45,
      "valueTemplate": "{{ package.label | boldEndingDigits }}",
      "paragraphFontName": "Helvetica",
      "paragraphFontSize": 7,
      "paragraphSpacing": 8,
      "horizontalParagraphAlignment": "CENTER",
      "paragraphTextResizeStrategy": "SHRINK_TEXT"
    },
    {
      "description": "Logo",
      "elementType": "IMAGE",
      "xStartFraction": 0.25,
      "xEndFraction": 0.75,
      "yStartFraction": 0.84,
      "yEndFraction": 0.98,
      "valueTemplate": "{{ images['logo.png'] }}"
    },
    {
      "description": "Product name",
      "elementType": "TEXT",
      "xStartFraction": 0.05,
      "xEndFraction": 0.95,
      "yStartFraction": 0.69,
      "yEndFraction": 0.81,
      "valueTemplate": "{{ package.item.name }}",
      "paragraphFontName": "Helvetica-Bold",
      "paragraphFontSize": 11,
      "paragraphSpacing": 12,
      "horizontalParagraphAlignment": "CENTER",
      "paragraphTextResizeStrategy": "SHRINK_TEXT"
    },
    {
      "description": "Potency",
      "elementType": "TEXT",
      "xStartFraction": 0.05,
      "xEndFraction": 0.95,
      "yStartFraction": 0.27,
      "yEndFraction": 0.35,
      "valueTemplate": "{{ package.metadata.indexedLabResults.totalTHC.full }}",
      "paragraphFontName": "Helvetica-Bold",
      "paragraphFontSize": 10,
      "paragraphSpacing": 11,
      "horizontalParagraphAlignment": "CENTER",
      "paragraphTextResizeStrategy": "SHRINK_TEXT"
    },
    {
      "description": "Lab results",
      "elementType": "TABLE",
      "xStartFraction": 0.1,
      "xEndFraction": 0.9,
      "yStartFraction": 0.14,
      "yEndFraction": 0.27,
      "valueTemplate": "<table><tbody>{% for key in ['totalTHC', 'totalCBD', 'CBG', 'totalTerpenes'] %}{% set entry = package.metadata.indexedLabResults[key] %}<tr><td><b>{{ entry.name }}</b></td><td>{{ entry.value }} {{ entry.unit }}</td></tr>{% endfor %}</tbody></table>",
      "paragraphFontName": "Helvetica",
      "paragraphFontSize": 7,
      "paragraphSpacing": 8,
      "paragraphTextResizeStrategy": "SHRINK_TEXT"
    }
  ]
}

Next Steps