Choose a version:

Print API

The Print API enables document printing functionality in your POS UI extension. Use this API to trigger the native print dialog for your documents.

Supported document types:

HTML documents (.html, .htm) - Best printing experience with full CSS styling, embedded images, and complex layouts. Use for receipts, invoices, and formatted reports.
Text files (.txt, .csv) - Plain text with basic content and tabular data support. Use for simple receipts and data exports.
Image files (.png, .jpg, .jpeg, .gif, .bmp, .webp) - Common web formats with format-specific optimizations. Use for logos, charts, QR codes, and barcodes.
PDF files (.pdf) - Behavior varies by platform: prints directly on iOS/desktop, but downloads to external viewer on Android. Use for complex documents and compliance requirements.

Anchor to Use casesUse cases

Custom receipts: Print custom receipts or invoices with branded formatting.
Labels: Generate and print shipping labels, return labels, or inventory documents.
Reports: Create printed reports for sales analytics, inventory counts, or summaries.
Customer communications: Print loyalty program info, promotional materials, or instructions.

Support

Targets (28)

Supported targets

Anchor to PropertiesProperties

The shopify global object provides methods for triggering document printing. Access the following properties on shopify to initiate print operations with HTML, text, image, and PDF document types.

Anchor to print print (src: string) => Promise<void> required: Triggers a print dialog for the specified document source. The print() method accepts either:

• A relative path that will be appended to your app's application_url

• A full URL to your app's backend that will be used to return the document to print

Returns a promise that resolves when content is ready and the native print dialog appears. Use for printing custom documents, receipts, labels, or reports.

Examples

jsx

import {render} from 'preact';

export default async () => {

render(<Extension />, document.body);

};

const Extension = () => {

return (

<s-tile

heading="My app"

subheading="Hello world!"

onClick={() => {

shopify.print.print('documents/test-print');

}}

);

};

Examples

Description

Trigger the native print dialog from a smart grid tile action. This example shows how to use `shopify.print()` to print a document specified by a relative path. This allows quick printing of receipts, labels, or reports directly from the POS home screen.

jsx

import {render} from 'preact';

export default async () => {
  render(<Extension />, document.body);
};

const Extension = () => {
  return (
    <s-tile
      heading="My app"
      subheading="Hello world!"
      onClick={() => {
        shopify.print.print('documents/test-print');
      }}
    />
  );
};

Description

Print documents hosted on external servers using full URLs. This example shows how to use `shopify.print()` with a complete URL to print remotely hosted documents. This enables dynamic content generation or printing from external services.

jsx

import {render} from 'preact';

export default async () => {
  render(<Extension />, document.body);
};

const Extension = () => {
  return (
    <s-tile
      heading="My App"
      subheading="Print with full URL"
      onClick={async () => {
        // Using a full URL directly
        await shopify.print.print('https://my-print-service.com/api/print/document');
      }}
    />
  );
};

Description

Print documents using relative paths within your extension bundle. This example demonstrates using `shopify.print()` with a relative path to reference HTML, text, image, or PDF files included in your extension. This makes it easy to print pre-defined templates or documents.

jsx

import {render} from 'preact';

export default async () => {
  render(<Extension />, document.body);
};

const Extension = () => {
  return (
    <s-tile
      heading="My App"
      subheading="Print with relative path"
      onClick={async () => {
        // If your application_url is "https://my-app.com"
        // This will resolve to "https://my-app.com/api/print/document"
        await shopify.print.print('/api/print/document');
      }}
    />
  );
};

Anchor to Best practicesBest practices

Use appropriate document formats: Choose HTML for rich formatting and responsive design, text for simple content, images for graphics, and PDFs for complex documents while considering platform limitations.
Handle printing errors gracefully: Implement proper error handling for print operations, including network failures, unsupported document types, or printer connectivity issues.
Optimize documents for printing: Design your printable documents with appropriate sizing, margins, and formatting that work well with printers and standard paper sizes.
Provide user feedback: Give users clear feedback about print operations, including loading states, success confirmations, and error messages when printing fails.

Anchor to LimitationsLimitations

PDF printing on Android devices requires downloading the file and using an external application, which may interrupt the user workflow.

Was this page helpful?