自定义 Order Printer 模板

已于 Apr 20, 2024 打印了此页面。若要查看当前版本，请访问 https://help.shopify.com/zh-CN/manual/orders/order-printer/customizing-order-templates。

您可以在 Shopify 后台为 Order Printer 应用创建和自定义最多 15 个模板。默认情况下，Order Printer 应用包含两个模板：

  • 发票 - 您可以发送给客户的基本发票
  • 装箱单 - 您的商店地址和客户的收货地址的打印单

拓展业务：发票和装箱单仅仅是一个开始。在订单中添加其他装箱物品（例如产品小样和优惠券）是与客户建立联系的有效方法。

本页相关主题

创建新的 Order Printer 模板

您需要熟悉 HTML、CSS 和 Liquid 才能创建新的 Order Printer 模板。Shopify 模板客服团队可以帮助您在 Shopify 设计政策范围内进行微调。

步骤：

  1. 在 Shopify 后台中，点击设置 > 应用和销售渠道。

  2. 点击 Order Printer 打开应用。

  3. 点击管理模板。

  4. 点击添加模板。

  5. 在名称字段中输入新模板的名称。

  6. 在代码字段中添加 HTML、CSS 或 Liquid 代码以创建模板。

  7. 完成后，点击保存。

编辑 Order Printer 模板

您需要熟悉 HTML、CSS 和 Liquid，才能编辑 Order Printer 模板。Shopify 模板客服团队可以帮助您在 Shopify 设计政策范围内进行微调。

步骤：

  1. 在 Shopify 后台中，点击设置 > 应用和销售渠道。

  2. 点击 Order Printer 打开应用。

  3. 点击管理模板。

  4. 点击要编辑的模板的名称。

  5. 通过在代码字段中添加或编辑 HTML、CSS 或 Liquid 代码，对模板进行更改。若要预览模板自定义项的示例，请参阅示例模板自定义项。

  6. 完成后，点击保存。

模板自定义示例

下方示例说明了自定义 Order Printer 模板的一些常用方法：

  1. 在 Shopify 后台中，转至内容 > 文件。
  2. 点击上传文件并选择计算机上的图片文件。
  3. 在文件页面上，找到上传的文件，然后点击复制 URL。
  4. 在 Shopify 后台中，点击设置 > 应用和销售渠道。
  5. 点击 Order Printer 打开应用。
  6. 点击管理模板。
  7. 点击要编辑的模板的名称。
  8. 在您希望显示 logo 的模板中输入以下代码片段：<img src="your-image-URL">。
  9. 将 your-image-URL 替换为您复制的图片 URL。根据所需的 logo 显示位置，您可能需要添加 <br/> 标签以在图片之前或之后添加换行符。
  1. 在 Shopify 应用中，点击 ... 按钮，然后点击设置。
  2. 在商店设置部分，点击文件。
  3. 点击上传文件并选择计算机上的图片文件。
  4. 在文件页面上，找到上传的文件，然后点击复制 URL。
  5. 在 Shopify 后台中，点击设置 > 应用和销售渠道。
  6. 点击 Order Printer 打开应用。
  7. 点击管理模板。
  8. 点击要编辑的模板的名称。
  9. 在您希望显示 logo 的模板中输入以下代码片段：<img src="your-image-URL">。
  10. 将 your-image-URL 替换为您复制的图片 URL。根据您希望 logo 显示的位置，您可能需要添加 <br/> 标签以在图片之前或之后添加换行符。
  1. 在 Shopify 应用中，点击 ... 按钮，然后点击设置。
  2. 在商店设置部分，点击文件。
  3. 点击上传文件并选择计算机上的图片文件。
  4. 在文件页面上，找到上传的文件，然后点击复制 URL。
  5. 在 Shopify 后台中，点击设置 > 应用和销售渠道。
  6. 点击 Order Printer 打开应用。
  7. 点击管理模板。
  8. 点击要编辑的模板的名称。
  9. 在您希望显示 logo 的模板中输入以下代码片段：<img src="your-image-URL">。
  10. 将 your-image-URL 替换为您复制的图片 URL。根据您希望 logo 显示的位置，您可能需要添加 <br/> 标签以在图片之前或之后添加换行符。

它的 HTML 显示形式应如下所示：

Example HTML code

示例：将表格宽度设置为 100%

若要为表格添加边框并将宽度拉伸为 100%，请将 table-tabular 类添加到表格中：

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

示例：显示产品缩略图

若要包含产品缩略图，请将此代码插入模板：

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

添加订单详细信息

备注：以下自定义需要具有 HTML 和 Liquid 的知识。

您可以向模板中添加订单详细信息，例如所购产品的名称、数量和费用。要向模板添加订单详细信息，请执行以下操作：

  1. 在 Shopify 后台中，点击设置 > 应用和销售渠道。

  2. 点击 Order Printer 打开应用。

  3. 点击管理模板。

  4. 点击要编辑的模板的名称。

  5. 使用 Liquid 变量添加订单详情，并使用 HTML 添加格式。例如，{{ line_item.price | money }} 将打印商品的价格。

  6. 完成后，点击保存。

例如，Nyla 想对装箱单模板进行编辑，使其包括要发货的商品列表。她在 Order Printer 应用中将以下代码添加到 Packing slip 模板底部：

<br>
<br>
<table class="table-tabular" style="margin: 0 0 1.5em 0;">
  <thead>
    <tr>
      <th>Quantity</th>
      <th>Item</th>
      {% if tax_lines.size > 0 %}
      <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>

最终的结果是，Nyla 的装箱单现在包含一张列出了已购产品的表格。

准备好开始使用 Shopify 进行销售了吗？

免费试用