Trợ giúp
Đăng nhập

Tạo và chỉnh sửa mẫu bằng Shopify Order Printer

Bạn có thể tạo và chỉnh sửa mẫu bằng ứng dụng Shopify Order Printer trong bảng điều khiển quản trị Shopify. Theo mặc định, ứng dụng Shopify Order Printer bao gồm các mẫu sau:

  • Hóa đơn: Hóa đơn mà bạn có thể gửi cho khách hàng
  • Phiếu đóng gói: Bản in địa chỉ cửa hàng của bạn và địa chỉ giao hàng của khách hàng.
  • Danh sách lấy hàng: Tài liệu bao gồm danh sách mặt hàng cần lấy để thực hiện đơn hàng của khách hàng.

Bạn có thể sử dụng Liquid để tạo mẫu tùy chỉnh riêng cho các tờ chèn trong gói hàng khác, chẳng hạn như phiếu giảm giá, nhãn hoặc biên lai. Ứng dụng Shopify Order Printer hỗ trợ các mẫu được tạo bằng HTML, CSS và biến Liquid.

Trên trang này

Những điểm cần lưu ý khi tạo mẫu trong ứng dụng Shopify Order Printer

Xem xét những điểm cần lưu ý sau trước khi tạo mẫu trong ứng dụng Shopify Order Printer:

Tạo mẫu

Bạn có thể tạo mẫu mới cho chứng từ đơn hàng.

Để thiết lập mẫu danh sách lấy hàng, hãy tham khảo Thiết lập và in danh sách lấy hàng bằng ứng dụng Shopify Order Printer.

Các bước:

  1. Trong bảng điều khiển quản trị Shopify, vào phần Ứng dụng > Order Printer.

  2. Nhấp vào Mẫu.

  3. Nhấp vào Tạo mẫu.

  4. Trong trường Tên, nhập tên cho mẫu, ví dụ như nhãn hoặc phiếu giảm giá.

  5. Trong mục Chỉnh sửa mã, thêm mã HTML, CSS hoặc Liquid để tạo mẫu.

  6. Tùy chọn: Để xem trước mẫu, nhấp vào Xem trước.

  7. Nhấp vào Lưu.

Chỉnh sửa mẫu

Bạn có thể chỉnh sửa mẫu hiện có. Tìm hiểu thêm về việc tùy chỉnh mẫu Order Printer.

Các bước:

  1. Trong bảng điều khiển quản trị Shopify, vào phần Ứng dụng > Order Printer.

  2. Nhấp vào Mẫu.

  3. Nhấp vào mẫu bạn muốn chỉnh sửa.

  4. Trong mục Chỉnh sửa mã, thêm hoặc chỉnh sửa mã HTML, CSS hoặc Liquid.

  5. Tùy chọn: Để xem trước mẫu, nhấp vào Xem trước.

  6. Nhấp vào Lưu.

Khôi phục mẫu mặc định

Bạn có thể khôi phục mẫu phiếu đóng gói và hóa đơn có sẵn về giá trị mặc định. Sử dụng các khối mã sau để khôi phục mẫu về mặc định.

Mẫu hóa đơn mặc định

Phiên bản từ ngày 6 tháng 6 năm 2024.

<div>
  <div class="columns">
    <h1>Invoice</h1>
    <div>
      <p style="text-align: right; margin: 0;">
      Order {{ order.order_name }}<br />
      {% if order.po_number %}PO # {{ order.po_number }}<br />{% endif %}
      {{ order.created_at | date: "%B %e, %Y" }}
    </p>
  </div>
</div>
<div class="columns" style="margin-top: 1.5em;">
  <div class="address">
    <strong>From</strong><br/>
    {{ shop.name }}<br/>
    {{ shop.address | format_address }}
    {% if shop.phone %}{{ shop.phone }}{% endif %}
  </div>
  {% if order.billing_address %}
  <div class="address">
    <strong>Bill to</strong>
    {{ order.billing_address | format_address  }}
  </div>
  {% endif %}
  {% if order.shipping_address %}
  <div class="address">
    <strong>Ship to</strong>
    {{ order.shipping_address | format_address  }}
    {% if order.shipping_address.phone %}{{ order.shipping_address.phone }}{% endif %}
  </div>
  {% endif %}
</div>
<hr />
<h2>Order Details</h2>
<table class="table-tabular" style="margin: 1em 0 0 0;">
  <thead>
    <tr>
      <th scope="col">Qty</th>
      <th scope="col">Item</th>
      <th scope="col" style="text-align: right;">Price</th>
    </tr>
  </thead>
  <tbody>
    {% for line_item in order.line_items %}
      <tr>
        <td scope="row">{{ line_item.quantity }}</td>
        <td>{{ line_item.title }}
        {% if line_item.line_level_discount_allocations.size > 0 %}
          <span class="subduedText">
            {% for discount_allocation in line_item.line_level_discount_allocations %}
            <br>{{ discount_allocation.discount_application.title }} (-{{ discount_allocation.amount | money }})
            {% endfor %}
          </span>
        {% endif %}
        </td>
        <td style="text-align: right;">
          {% if line_item.original_price != line_item.final_price %}
            <span class="subduedText"><s>{{ line_item.original_price | money }}</s></span>
          {% endif %}
          {{ line_item.final_price | money }}
        </td>
      </tr>
    {% endfor %}
    <tr>
      <td scope="row" colspan="2" style="text-align: right;">Subtotal</td>
      <td style="text-align: right;">{{ order.line_items_subtotal_price | money }}</td>
    </tr>
    {% for discount_application in order.cart_level_discount_applications %}
    <tr>
      <td scope="row" colspan="2" style="text-align: right;">{% if discount_application.title %}<span class="subduedText">{{ discount_application.title }}</span>{% endif %}</td>
      <td style="text-align: right;">-{{ discount_application.total_allocated_amount | money }}</td>
    </tr>
    {% endfor %}
    <tr>
      <td scope="row" colspan="2" style="text-align: right;">Tax</td>
      <td style="text-align: right;">{{ order.tax_price | money }}</td>
    </tr>
    {% if order.shipping_address %}
      <tr>
        <td scope="row" colspan="2" style="text-align: right;">Shipping</td>
        <td style="text-align: right;">{{ order.shipping_price | money }}</td>
      </tr>
    {% endif %}
    <tr>
      <td scope="row" colspan="2" style="text-align: right;"><strong>Total</strong></td>
      <td style="text-align: right;"><strong>{{ order.total_price | money }}</strong></td>
    </tr>
    {% if order.net_payment != order.total_net_amount %}
      <tr>
        <td scope="row" colspan="2" style="text-align: right;">Total Paid</td>
        <td style="text-align: right;">{{ order.net_payment | money }}</td>
      </tr>
    {% endif %}
    {% if order.total_refunded_amount > 0 %}
      <tr>
        <td scope="row" colspan="2" style="text-align: right;">Total Refunded</td>
        <td style="text-align: right;">-{{ order.total_refunded_amount | money }}</td>
      </tr>
    {% endif %}
    {% if order.net_payment != order.total_net_amount %}
      <tr>
        <td scope="row" colspan="2" style="text-align: right;"><strong>Outstanding Amount</strong></td>
        <td style="text-align: right;"><strong>{{ order.total_price | minus: order.net_payment | money }}</strong></td>
      </tr>
    {% endif %}
  </tbody>
</table>
{% if transactions.size > 1 %}
  <h2>Transaction Details</h2>
  <table class="table-tabular" style="margin: 0 0 1.5em 0;">
    <thead>
      <tr>
        <th scope="col">Type</th>
        <th scope="col">Amount</th>
        <th scope="col">Kind</th>
        <th scope="col">Status</th>
      </tr>
    </thead>
    <tbody>
      {% for transaction in transactions %}
        <tr>
          <td scope="row">{{ transaction.gateway | payment_method }}</td>
          <td>{{ transaction.amount | money }}</td>
          <td>{{ transaction.kind }}</td>
          <td>{{ transaction.status }}</td>
        </tr>
      {% endfor %}
    </tbody>
  </table>
{% endif %}
{% if order.note %}
<h2>Note</h2>
<p>{{ order.note }}</p>
{% endif %}
<p style="margin-bottom: 0;">If you have any questions, please send an email to <u>{{ shop.email }}</u></p>
</div>

Mẫu phiếu đóng gói mặc định

Phiên bản từ ngày 6 tháng 6 năm 2024.

<div>
<div class="columns">
  <h1>Packing Slip</h1>
  <div class="address">
    <p style="text-align: right; margin: 0;">
    Order {{ order.order_name }}<br />
    {% if order.po_number %}PO # {{ order.po_number }}<br />{% endif %}
    {{ order.created_at | date: "%B %e, %Y" }}
    </p>
  </div>
</div>
<div class="columns" style="margin-top: 1.5em;">
  <div class="address">
    <strong>From</strong><br/>
    {{ shop.name }}<br/>
    {{ shop.address | format_address }}
  </div>
  {% if order.shipping_address %}
  <div class="address">
    <strong>Ship to</strong>
    {{ order.shipping_address | format_address  }}
   </div>
  {% endif %}
</div>
<hr />
<h2>Order Details</h2>
<table class="table-tabular" style="margin: 1em 0 0 0;">
  <thead>
    <tr>
      <th scope="col" style="width: 15%; text-align: left;">Qty</th>
      <th scope="col" style="width: 85%; text-align: left;">Item</th>
    </tr>
  </thead>
  <tbody>
    {% for line_item in order.line_items %}
    <tr>
      <td scope="row" style="text-align: left;">{{ line_item.quantity }}</td>
      <td style="text-align: left;">{{ line_item.title }}</td>
    </tr>
    {% endfor %}
  </tbody>
</table>
</div>