Tạo và tùy chỉnh mẫu bằng Order Printer của Shopify

Bạn có thể tạo và tùy chỉnh mẫu bằng ứng dụng Shopify Order Printer trên trang quản trị Shopify. Ứng dụng Shopify Order Printer sẽ mặc định bao gồm các mẫu sau:

  • Hóa đơn: Hóa đơn bạn có thể gửi cho khách hàng
  • Phiếu giao hàng: Bản in chứa địa chỉ cửa hàng và địa chỉ giao hàng của khách hàng.

Bạn có thể sử dụng Liquid để tạo mẫu tùy chỉnh của riêng mình cho tờ rơi đi kèm bao bì khác, ví dụ như phiếu giảm giá, nhãn hoặc biên lai.

Những lưu ý khi tạo mẫu trong ứng dụng Order Printer của Shopify

Xem xét những lưu ý sau đây trước khi tạo mẫu trong ứng dụng Order Printer của Shopify:

Tạo mẫu

Bạn có thể tạo mẫu mới cho tài liệu của đơn hàng.

Bước:

  1. Trong trang quản trị Shopify, nhấp vào Cài đặt > Ứng dụng và kênh bán hàng.

  2. Trong trang Ứng dụng và kênh bán hàng, nhấp vào Order Printer.

  3. Nhấp vào Mở ứng dụng.

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

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

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

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

  8. Không bắt buộc: Để xem trước mẫu, nhấp vào Xem trước.

  9. 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ề tùy chỉnh mẫu, tham khảo Ví dụ về tùy chỉnh mẫu.

Bước:

  1. Trong trang quản trị Shopify, nhấp vào Cài đặt > Ứng dụng và kênh bán hàng.

  2. Trong trang Ứng dụng và kênh bán hàng, nhấp vào Order Printer.

  3. Nhấp vào Mở ứng dụng.

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

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

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

  7. Không bắt buộc: Để xem trước mẫu, nhấp vào Xem trước.

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

Ví dụ về nội dung tùy chỉnh mẫu

Xem lại các ví dụ sau để tìm hiểu cách tùy chỉnh mẫu Shopify Order Printer:

Bạn có thể thêm logo của mình vào mẫu.

Bước:

  1. Trên trang quản trị Shopify, vào mục Nội dung > Tệp.
  2. Nhấp vào Tải lên tệp rồi chọn tệp hình ảnh bạn muốn tải lên.
  3. Để sao chép URL của hình ảnh logo, nhấp vào biểu tượng Liên kết.
  4. Nhấp vào Cài đặt > Ứng dụng và kênh bán hàng.
  5. Nhấp vào Order Printer.
  6. Nhấp vào Mẫu.
  7. Nhấp vào tên mẫu bạn muốn chỉnh sửa.
  8. Trong trình biên tập mã, dán khối mã sau:

liquid <div style="text-align: center;"> <img style="width: 4em;" src="YOUR_IMAGE_URL_HERE"> </div>

  1. Thay YOUR_IMAGE_URL_HERE trong mã bằng URL hình ảnh của bạn.
  2. Không bắt buộc: Để căn chỉnh logo, thay đổi giá trị text-align thành left, right hoặc center.
  3. Không bắt buộc: Để điều chỉnh chiều rộng logo, thay đổi giá trị width thành giá trị lớn hơn hoặc nhỏ hơn, ví dụ như 8em hoặc 2em.
  4. Không bắt buộc: Để xem trước mẫu, nhấp vào Xem trước.
  5. Nhấp vào Lưu.

Ví dụ:

Xem lại ví dụ sau về cách HTML hiển thị sau khi bạn thêm logo vào mẫu:

Một ví dụ hiển thị khối mã về cách thêm logo vào mẫu

Tạo chiều rộng bảng 100%

Bạn có thể thêm đường viền vào bảng và kéo dài đến 100% chiều rộng. Bạn cần thêm lớp table-tabular vào bảng.

Bước:

  1. Trong trang quản trị Shopify, nhấp vào Cài đặt > Ứng dụng và kênh bán hàng.

  2. Trong trang Ứng dụng và kênh bán hàng, nhấp vào Order Printer.

  3. Nhấp vào Mở ứng dụng.

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

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

  6. Trong trình biên tập mã, tìm bảng bạn muốn chỉnh sửa rồi thêm lớp table-tabular vào bảng.

  7. Không bắt buộc: Để xem trước mẫu, nhấp vào Xem trước.

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

Ví dụ:

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

Hiển thị hình thu nhỏ của sản phẩm

Bạn có thể thêm hình thu nhỏ của sản phẩm vào mẫu đơn hàng. Bạn cần chèn khối mã tùy chỉnh vào mẫu.

Bước:

  1. Trong trang quản trị Shopify, nhấp vào Cài đặt > Ứng dụng và kênh bán hàng.

  2. Trong trang Ứng dụng và kênh bán hàng, nhấp vào Order Printer.

  3. Nhấp vào Mở ứng dụng.

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

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

  6. Thêm khối mã liquid {{ line_item.product.featured_image | product_img_url: 'thumb' | img_tag }} vào mẫu.

  7. Không bắt buộc: Để xem trước mẫu, nhấp vào Xem trước.

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

Thêm chi tiết đơn hàng

Bạn có thể thêm các chi tiết đơn hàng vào mẫu, ví dụ như tên, số lượng và giá của mặt hàng đã mua.

Bước:

  1. Trong trang quản trị Shopify, nhấp vào Cài đặt > Ứng dụng và kênh bán hàng.

  2. Trong trang Ứng dụng và kênh bán hàng, nhấp vào Order Printer.

  3. Nhấp vào Mở ứng dụng.

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

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

  6. Trong trình biên tập mã, sử dụng biến Liquid để thêm chi tiết đơn hàng và HTML để thêm định dạng. Ví dụ: Nếu sử dụng {{ line_item.price | money }}, giá của mặt hàng sẽ hiển thị.

  7. Không bắt buộc: Để xem trước mẫu, nhấp vào Xem trước.

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

Ví dụ:

Nyla muốn chỉnh sửa mẫu phiếu giao hàng để thêm danh sách các mặt hàng đang được vận chuyển. Cô thêm mã sau vào phía dưới mẫu Phiếu giao hàng trong ứng dụng Shopify Order Printer. Do đó, các phiếu giao hàng của Nyla hiện bao gồm một bảng liệt kê các mặt hàng cô mua.

liquid <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>

Bạn đã sẵn sàng bán hàng với Shopify?

Dùng thử miễn phí