{qrcode:text:size:margin}

Description

Renders the given text as a black-and-white QR code and returns it as a base64-encoded PNG data URI, ready to drop straight into the src attribute of an img tag. The text is encoded as UTF-8 with medium error correction (level M). If text is empty or only whitespace, it returns a 1x1 transparent GIF placeholder (data:image/gif;base64,...) instead of an error, so a missing value never breaks the page. Errors during image generation return the same placeholder. The image is generated inline (no file is written and no extra HTTP request is made), which keeps the QR code self-contained but makes the data URI long. size sets both width and height in pixels (default 300); margin sets the quiet-zone border in modules (default 2). To encode a payment QR code with an amount and account number, use qrpay instead.

Parameters

text required

Text to encode in the QR code, read as UTF-8. This is usually a URL, but it can be any string (plain text, a phone number, vCard, Wi-Fi config, etc.). If it is empty or only whitespace, the expression returns a 1x1 transparent GIF placeholder instead of a code.

size optional default 300

Width and height of the square PNG in pixels (the code is always square). Must be a plain non-negative integer with digits only; any non-numeric value falls back to the default. Larger sizes scan more reliably and print more sharply.

margin optional default 2

Width of the quiet-zone (the blank border around the code), measured in QR modules, not pixels. Must be a plain non-negative integer with digits only; any non-numeric value falls back to the default. The QR standard recommends at least 4; AA defaults to 2 to save space.

Examples

test[{substr:{qrcode:HELLO}:0:22}]
Expected[data:image/png;base64,]
Actual[data:image/png;base64,]
The raw output is a long base64 PNG data URI; here we keep only its first 22 characters to test it deterministically. A successful encode always begins data:image/png;base64, followed by the binary image. Use the whole value (without substr) as an img src.
test[{qrcode:}]
Expected[data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7]
Actual[data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7]
When text is empty (or only whitespace) qrcode does not error - it returns this fixed 1x1 transparent GIF data URI. The same placeholder is returned if image generation fails. So an empty field renders an invisible image rather than breaking the page.
virtual<img src="{qrcode:https#://actionapps.org}" alt="ActionApps website" width="150" height="150">
Expected(an img tag whose src is the base64 PNG, e.g. ; scanning it opens https://actionapps.org)
; scanning it opens https://actionapps.org)">ActualActionApps website
The everyday pattern: put the expression in the src attribute. Note the colon in https#:// is escaped as https#:// so the parser does not read it as a parameter separator. The width and height attributes scale the displayed image independently of the size parameter.
virtual<img src="{qrcode:https#://actionapps.org:600}" alt="AA website" width="200" height="200">
Expected(a 600x600 px PNG data URI, downscaled to 200px on screen by the img width/height)
ActualAA website
The second parameter sets the PNG width and height in pixels (here 600). A larger generated image stays sharp when printed or shown big, even if you display it smaller with the img attributes. Default size is 300.
test[{substr:{qrcode:HELLO:100}:22:34}]
Expected[iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCA]
Actual[iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCA]
A deterministic way to verify the size parameter: this slices 34 characters out of the base64 PNG that carry its header. The bytes AAAGQAAABk decode to a width and height of 100 (hex 0x64), proving qrcode:HELLO:100 produced a 100x100 image. Change the size and this prefix changes.
virtual<img src="{qrcode:https#://actionapps.org:300:4}" alt="AA website" width="150" height="150">
Expected(a 300x300 px PNG with a 4-module blank border around the code instead of the default 2)
ActualAA website
The third parameter is the quiet zone - the blank border around the code - measured in QR modules, not pixels. The QR standard recommends at least 4; AA defaults to 2. A wider margin can help finicky scanners but uses more of the image for whitespace.
virtual<img src="{qrcode:{permalink.......}}" alt="Scan to open this item" width="120" height="120">
Expected(a QR code of the current item permalink, e.g. encoding https://actionapps.org/.../item - scan it to open the item on a phone)
ActualScan to open this item
A common real-world use: feed an item field (here the permalink URL) into qrcode so each item gets its own scannable code. Any field-getter that yields a URL or text works. Output depends on the item, so this is illustrative.
← All expressions