How to display COAs on Shopify

The buyer you are actually writing this page for

A supplement buyer lands on your product page. They have already decided they care about lab testing. That is why they are on your page and not on a grocery store shelf. They scroll the hero, skip most of the bullet points, and start looking for proof. If they do not find it quickly, they leave.

That is the specific buyer a Certificate of Analysis display is for. Not the casual browser. The researcher. And they are a larger share of supplement, CBD, and nootropic traffic than most merchants realise, because the category self-selects. If you are searching for third party tested ashwagandha or full panel tested CBD, you are not price shopping. You are looking for the proof.

Most Shopify merchants in this category do have lab reports. They pay a lab somewhere between $200 and $500 per SKU per batch for analytical testing: cannabinoids, heavy metals, pesticides, residual solvents, microbials. The lab returns a Certificate of Analysis, a PDF with a logo, some sign-offs, a couple of tables, and a dozen or so numbers on it. The problem is almost never the testing. It is what happens to the PDF next.

Three defaults that fail

Open a hundred supplement and CBD product pages and you will see the same three patterns. Each one fails the researcher buyer in a different way, and each one throws away the investment the brand already made in lab testing.

Default one: the PDF link at the bottom of the page

Scroll past the hero, past the ingredient list, past the FAQ. There, inside a collapsed accordion, is an item called Lab Results or Third Party Testing. Clicking it reveals a single sentence: lab reports available on request, email us. Or a link that opens a COA PDF in a new tab.

This fails for three reasons:

The buyer has to know to look for it. The accordion is collapsed. The link is hidden behind two or three user actions.
The PDF opens in the browser default viewer, not inside your storefront. On mobile it often downloads rather than rendering, which a skeptical buyer reads as suspicious.
The PDF itself is a scan of a lab printout. It is oriented for the lab, not for the shopper. Two columns of small text, a microscopic analyte table, a signature block on page two. The buyer squints, gives up, and leaves.

The signal you intended (we test, here is the proof) does not arrive. The buyer infers the opposite: you are hiding something, or you do not understand what they came here for.

Default two: the photo upload

A subset of merchants paste a screenshot of the COA into the product page gallery as a fifth or sixth image. You open the product page, scroll through the hero shots and the lifestyle photo, and then there is a low-resolution JPEG of a lab printout.

This is worse than the accordion link. The image pinch-zooms poorly on mobile. It is not text, so search engines cannot index the analyte data. It is not scannable. It is not linkable. And it has no programmatic relationship to the batch you are currently shipping, which means the page drifts out of date the moment the next batch lands.

Default three: no display at all

A meaningful number of brands simply do not publish their COAs. The testing happens. The PDFs exist on a shared drive labelled Lab Reports. But nothing appears on the customer-facing site. The assumption is that if a buyer asks, customer service will email the report over.

For the researcher segment this is commercial failure. They do not ask. They assume the brand does not test, and they buy from a brand that demonstrates it does. A signal you do not publish is a signal that does not exist.

What a good display actually looks like

A COA display on a Shopify product page has to do three things well, in order of importance: show the current batch results clearly, link the original document, and not get in the way of the buyer who does not care. A good display disappears for the casual shopper and resolves everything for the researcher.

Structured data, not an image

The analyte data should render as native HTML, not as a screenshot. That means a table with rows like CBD · limit 0.3% · result 14.8% or Pesticides · limit 0.1 ppm · result ND, in plain text, with monospace numerals for the values. Rendered that way it is readable, accessible, indexable, and honest. It is also small. The buyer who wants to read it can read it in one pass.

Mobile, the first time

Lab tables are wide. Five columns is typical: analyte, units, limit, method, result. A naive copy onto mobile produces a horizontal scrollbar, which no buyer discovers. A good display either paginates the columns (primary columns first, secondary behind a disclosure), stacks each row vertically (analyte on top, data stacked below), or both.

The rule is that at 375 pixels of width, the widget never scrolls horizontally. Ever. If your current display does, it is broken for most of your traffic.

Pass indication without invention

This is the part most merchants get wrong. It is tempting to take the analyte result, compare it to the lab declared limit, and render a green Pass pill next to the row. Do not do that, unless the lab itself issued a pass status on that row.

The lab job is to report the number. The merchant job is to display it. Inventing a pass grade the lab did not issue is the exact kind of claim that attracts regulatory attention and invalidates the trust signal you were trying to build. A display that renders result 0.2 ppm · pass when the pass grade was never in the lab document is not transparent. It is a marketing decision dressed as data.

What is fine: rendering the lab own status column (many labs include a pass or fail column in the source document) with consistent visual treatment. What is not fine: generating pass grades programmatically. If the lab did not grade it, do not grade it.

Batch and lab provenance, always visible

The display should show, at the top:

The lab name and accreditation (ISO 17025 and the accreditation body, usually A2LA in the US).
The batch number and the date the batch was tested. The batch has to match the inventory variant the buyer is currently on.
A one tap link to the original PDF.

The accreditation line is a trust signal on its own. ISO 17025 is the international standard for testing laboratory competence. If the buyer wants to look up the lab, they can.

The original PDF, one tap away

A good display always includes a prominent link to the raw PDF. This matters even for buyers who will not click it, because it is visible proof that the display is backed by a real document. A buyer who looks at the clean HTML display and then sees a view original lab PDF link right underneath reads the whole package as trustworthy. Hiding the PDF under the clean display reads as a magic trick.

The compliance lines to hold

Supplement compliance in the US sits under the Dietary Supplement Health and Education Act of 1994 and the FDA subsequent rulings. The rules are detailed, but three of them shape how a COA display should be built.

No structure or function claims from the COA itself

If your COA shows a cannabinoid content, a caffeine content, or a botanical extract concentration, that is data. It is not a health claim. The moment you combine the data with copy like supports focus, promotes sleep, boosts immunity, you have made a structure/function claim, which has its own rules.

A good COA display shows the data and says nothing about what the data means. The lab results go on the product page. The structure/function claims, if you make any, live elsewhere and carry the required disclaimers.

Never modify the lab output

Changing the numbers, re-ordering analytes to hide inconvenient results, removing a pesticide row because the limit was borderline: these are the classic patterns that get brands into trouble. The discipline that keeps you out of that territory is a technical one. Whatever builds your COA display should not be able to modify the parsed values. The display is a projection of the document, not an edit of it.

Keep personal data off the public display

COAs sometimes include lab personnel names, hand-signed sign-off pages, internal lot codes, or customer codes. None of these belong on a public product page. The lab name, the accreditation, the batch, and the analyte data are the public fields. Everything else stays on the PDF behind the link.

How Kreyd approaches this

This is the shape Kreyd: COA & Lab Reports takes. A merchant uploads the lab PDF. The app parses it into structured fields. The merchant reviews what was parsed on one screen and corrects anything wrong. The widget renders on the product page with the batch, the analyte table, the accreditation line, and the prominent original PDF link. The PDF is always one tap away. No invented pass grades. No Kreyd Verified badge on your storefront. The lab stays the source of truth.

The fact that the app ships with these rules baked in is not a marketing choice, it is the only safe way to build this category of product on Shopify. Everything else is a liability waiting to be priced in.

If you already test every batch, the cost of shipping the proof is small. Minutes per SKU, once per batch, on a plan that starts at $19 a month. And the researcher segment, the buyers who already decided they care about lab testing, will read the display and stay on the page.

How to display Certificates of Analysis on Shopify