Customizing Order Printer templates

You can create and customize up to 15 templates for the Order Printer app in your Shopify admin. By default, the Order Printer app includes two templates:

  • Invoice - a basic invoice that you can send to a customer
  • Packing slip - a printout of your shop address and your customer's shipping address

Create a new Order Printer template

Creating a new Order Printer template requires you to be familiar with HTML, CSS, and Liquid. Shopify Theme Support can help with minor adjustments within the scope of the Shopify Design Policy.

Steps:

  1. From your Shopify admin, go to Apps.

  2. Click Order Printer to open the app.

  3. Click Manage templates:

    Manage templates button

  4. Click Add template:

    Click 'Add template'

  5. Enter a name for your new template in the Name field.

  6. Add HTML, CSS, or Liquid code in the Code field to create your template.

  7. When you're done, click Save.

Edit an Order Printer template

Editing your Order Printer templates requires you to be familiar with HTML, CSS, and Liquid. Shopify Theme Support can help with minor adjustments within the scope of the Shopify Design Policy.

Steps:

  1. From your Shopify admin, go to Apps.

  2. Click Order Printer to open the app.

  3. Click Manage templates:

    Manage templates button

  4. Click the name of the template that you want to edit:

    Select template to edit

  5. Make your changes to the template by adding or editing HTML, CSS, or Liquid code in the Code field. To see examples of template customizations, see Example template customizations.

  6. When you're done, click Save.

Example template customizations

The following examples show some common ways to customize Order Printer templates:

Example: Add your logo to Order Printer templates

You can add your logo to order invoices, packing slips, and custom templates:

  1. Click Upload Files and select the image file on your computer.

  2. On the Files page, click the image URL to highlight it, then copy the text:

    Copy the image URL

  3. From your Shopify admin, go to Apps.

  4. Click Order Printer to open the app.

  5. Click Manage templates:

    Manage templates button

  6. Click the name of the template that you want to edit:

    Select template to edit

  7. Enter the following code snippet into your template where you would like your logo to appear: <img src="your-image-URL">.

  8. Replace your-image-URL with the image URL you copied. Depending on where you want your logo to appear, you might need to add a <br/> tag to add a line break before or after your image.

    It should look like this in the HTML:

    Example HTML code

    And like this on your invoice:

    Example of a customized email template

Example: Make table widths 100%

To make your tables have borders and stretch to 100% width, add a table-tabular class to your table:

<table class="table-tabular">
    ...
</table>

Example: Show product thumbnails

To include product thumbnails, insert this code into your template:

{{ line_item.product.featured_image | product_img_url: 'thumb' | img_tag }}

Add order details

You can add order details to your templates, such as the name, quantity, and cost of items purchased. To add order details to your template:

  1. From your Shopify admin, go to Apps.

  2. Click Order Printer to open the app.

  3. Click Manage templates:

    Manage templates button

  4. Click the name of the template that you want to edit:

    Select template to edit

  5. Use Liquid variables to add order details and HTML to add formatting. For example, the `` will print the price of the item.

  6. When you're done, click Save.

For example, Nyla wants to edit her packing slip template to include a list of the items being shipped. She adds the following code to the bottom of her Packing slip template in the Order Printer app:

<br>
<br>
<table class="table-tabular" style="margin: 0 0 1.5em 0;">
  <thead>
    <tr>
      <th>Quantity</th>
      <th>Item</th>
      {% if show_line_item_taxes %}
      <th>Taxes</th>
      {% endif %}
      <th>Price</th>
    </tr>
  </thead>
  <tbody>
    {% for line_item in line_items %}
      <tr>
        <td>{{ line_item.quantity }} x</td>
        <td><b>{{ line_item.title }}</b></td>
        {% if line_item.tax_lines %}
          <td>
            {% for tax_line in line_item.tax_lines %}
              {{ tax_line.price | money }} {{ tax_line.title }}<br/>
            {% endfor %}
          </td>
        {% endif %}
        <td>{{ line_item.price | money }}</td>
      </tr>
    {% endfor %}
  </tbody>
</table>

As a result, Nyla's packing slips now include a table that lists the items purchased:

Example packing slip

Ready to start selling with Shopify?

Try it free