How to Add Product Prices to Shopify Packing Slips Easily

Are you struggling to include product prices on your Shopify packing slips? Many store owners face this challenge, as Shopify doesn’t provide a built-in option to display prices on packing slips by default. However, with some custom code and a bit of know-how, you can easily add this crucial information to your shipping documents. In this guide, we’ll walk you through the process of adding product prices to your Shopify packing slips, along with some additional customization options to enhance your shipping workflow.

Understanding the Challenge

Why Prices Matter on Packing Slips

Packing slips serve as an essential document for both merchants and customers. They provide a detailed list of items included in a shipment, helping to verify order accuracy and streamline the fulfillment process. Including prices on packing slips can be beneficial for several reasons:

1. Improved customer experience
2. Easier order verification for recipients
3. Simplified returns and exchanges process

However, Shopify’s default packing slip template doesn’t include product prices, which can be frustrating for store owners who need this information.

Shopify’s Limitations

Shopify’s packing slip customization options are somewhat limited out of the box. While you can modify certain aspects of the packing slip template, adding prices isn’t a straightforward process. This limitation has led many store owners to seek custom solutions to include this vital information.

The Solution: Custom Liquid Code

Overview of the Custom Code Approach

The most effective way to add product prices to your Shopify packing slips is by modifying the packing slip template using Liquid code. This method involves adding a snippet of code that retrieves the price information for each line item and displays it on the packing slip.

Step-by-Step Implementation

To add prices to your packing slips, follow these steps:

1. Go to your Shopify admin panel
2. Navigate to Settings > Shipping and delivery
3. Click on “Manage” next to “Packing slips”
4. In the packing slip editor, locate the section where line items are displayed
5. Add the following code snippet within the line item loop:

{%- comment -%} Adding prices to packing slip {%- endcomment -%}
{% assign final_price = nil %}
{% for item in order.line_items %}
  {% if item.sku == line_item.sku %}
    {% assign final_price = item.final_price %}
  {% endif %}
{% endfor %}
{% if final_price %}
  {{ final_price | money }}
{% endif %}
{%- comment -%} Done adding prices to packing slip {%- endcomment -%}

This code snippet retrieves the price for each line item based on its SKU and displays it on the packing slip.

Customizing the Price Display

You can further customize how the price is displayed by modifying the code. For example, you might want to add a label before the price or adjust its formatting:

<span class="price-label">Price: </span>{{ final_price | money_with_currency }}

This will display the price with a label and include the currency symbol.

Advanced Customization Options

Adding Subtotals and Order Totals

In addition to individual product prices, you may want to include subtotals and order totals on your packing slips. You can achieve this by adding the following code at the end of your line item loop:

<div class="flex-totals">
  <p class="text-align-right">
    <br>Subtotal {{ order.subtotal_price | money }}
    <br>Taxes {{ order.tax_price | money }}
    <br>Shipping {{ order.shipping_price | money }}
    <br>Total {{ order.total_price | money }}
  </p>
</div>

This will display a breakdown of the order total, including subtotal, taxes, shipping, and the final total.

Incorporating Company Branding

To make your packing slips more professional and on-brand, consider adding your company logo and contact information. You can do this by inserting the following code at the top of your packing slip template:

<div class="header">
  <div class="shop-title">
    <img src="YOUR_LOGO_URL" alt="{{ shop.name }}" style="width: 80px; height: auto;">
  </div>
  <div class="order-title">
    <p class="text-align-right">Order {{ order.name }}</p>
    <p class="text-align-right">{{ order.created_at | date: "%B %e, %Y" }}</p>
  </div>
</div>

Replace “YOUR_LOGO_URL” with the actual URL of your company logo.

Styling Your Packing Slip

To ensure your packing slip looks professional and is easy to read, you can add some CSS styling. Here’s a basic example of how to style your packing slip:

<style type="text/css">
  body {
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
  }
  .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
  }
  .flex-line-item {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
  }
  .flex-totals {
    margin-top: 20px;
    text-align: right;
  }
</style>

This CSS will give your packing slip a clean, professional look with proper spacing and alignment.

Troubleshooting Common Issues

Prices Not Displaying Correctly

If you find that prices are not displaying correctly on your packing slips, there are a few potential issues to check:

1. Ensure that the SKU matching in the code is correct
2. Verify that your products have unique SKUs
3. Check for any conflicts with other custom code on your packing slip template

Handling Multiple Variants

When dealing with products that have multiple variants, you may need to adjust the code to ensure the correct price is displayed. One approach is to use the product title and variant title for matching instead of the SKU:

{% assign line_name = line_item.title %}
{% if line_item.variant_title != blank %}
  {% assign line_name = line_name | append: " - " | append: line_item.variant_title %}
{% endif %}
{% for item in order.line_items %}
  {% assign order_name = item.title %}
  {% if order_name == line_name %}
    {% assign final_price = item.final_price %}
  {% endif %}
{% endfor %}

This method can help ensure that the correct price is displayed for each variant.

Keeping Up with Shopify Updates

Shopify occasionally updates its platform, which can sometimes affect custom code. To ensure your packing slip customizations continue to work:

1. Regularly test your packing slips to ensure prices are displaying correctly
2. Keep an eye on Shopify’s developer changelog for any updates that might affect liquid code
3. Be prepared to adjust your code if necessary to accommodate platform changes

By following these troubleshooting tips, you can maintain accurate price displays on your packing slips and provide a better experience for your customers and fulfillment team.

Adding product prices to your Shopify packing slips may require a bit of custom code, but the benefits are well worth the effort. With the solutions and customization options provided in this guide, you can create informative, professional-looking packing slips that enhance your order fulfillment process and improve customer satisfaction. Remember to test your customizations thoroughly and keep your code up to date with any Shopify platform changes to ensure consistent functionality.