Shopify Order Printer를 사용하여 템플릿 생성 및 편집하기
Shopify 관리자에서 Shopify Order Printer 앱을 사용하여 템플릿을 생성하고 편집할 수 있습니다. Shopify Order Printer 앱에는 기본적으로 다음 템플릿이 포함되어 있습니다.
- 인보이스: 고객에게 보낼 수 있는 인보이스
- 패킹 슬립 - 스토어의 주소 및 고객의 배송 주소 인쇄물
Liquid를 사용하여 쿠폰, 레이블 또는 영수증과 같은 다른 패키지 삽입물에 대한 자체 사용자 지정 템플릿을 생성할 수 있습니다. Shopify Order Printer 앱은 HTML, CSS 및 Liquid 변수로 제작된 템플릿을 지원합니다.
Shopify Order Printer 앱에서 템플릿 생성 시 고려 사항
Shopify Order Printer 앱에서 템플릿을 생성하기 전에 다음 고려 사항을 검토하세요.
- Shopify Order Printer 앱에서 템플릿을 생성하거나 편집하려면 HTML, CSS 및 Liquid에 익숙해야 합니다. Shopify 테마 지원에서는 Shopify 디자인 정책 범위 내에서 사소한 조정에 도움을 드립니다.
- 템플릿은 최대 15개까지 생성할 수 있습니다.
- 지원되는 모든 템플릿 사용자 지정은 Shopify Order Printer의 Liquid 변수 및 필터 참조를 검토하세요.
템플릿 생성
주문서의 새 템플릿을 생성할 수 있습니다.
단계:
Shopify Admin에서 설정 > 앱 및 판매 채널을 클릭합니다.
앱 및 판매 채널 페이지에서 Order Printer을(를) 클릭합니다.
앱 열기 를 클릭합니다.
템플릿을 클릭합니다.
템플릿 생성을 클릭합니다.
이름 필드에 레이블이나 쿠폰과 같은 템플릿의 이름을 입력합니다.
코드 편집 섹션에서 HTML, CSS 또는 Liquid 코드를 추가하여 템플릿을 생성합니다.
선택 사항: 템플릿을 미리 보려면 미리 보기를 클릭합니다.
저장을 클릭합니다.
템플릿 편집
기존 템플릿을 편집할 수 있습니다. 템플릿 사용자 지정에 대한 자세한 내용은 템플릿 사용자 지정 예시를 참조하세요.
단계:
Shopify Admin에서 설정 > 앱 및 판매 채널을 클릭합니다.
앱 및 판매 채널 페이지에서 Order Printer을(를) 클릭합니다.
앱 열기 를 클릭합니다.
템플릿을 클릭합니다.
편집할 템플릿을 클릭합니다.
코드 편집 섹션에서 HTML, CSS 또는 Liquid 코드를 추가하거나 편집합니다.
선택 사항: 템플릿을 미리 보려면 미리 보기를 클릭합니다.
저장을 클릭합니다.
기본 템플릿 복구하기
기본 제공 패킹 슬립 및 인보이스 템플릿을 기본값으로 복구할 수 있습니다. 다음 코드 블록을 사용하여 템플릿을 기본값으로 복구합니다.
인보이스 기본 템플릿
2024년 6월 6일 버전입니다.
liquid
<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>Qty</th>
<th>Item</th>
<th style="text-align: right;">Price</th>
</tr>
</thead>
<tbody>
{% for line_item in order.line_items %}
<tr>
<td>{{ 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 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 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 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 colspan="2" style="text-align: right;">Shipping</td>
<td style="text-align: right;">{{ order.shipping_price | money }}</td>
</tr>
{% endif %}
<tr>
<td 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 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 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 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>Type</th>
<th>Amount</th>
<th>Kind</th>
<th>Status</th>
</tr>
</thead>
<tbody>
{% for transaction in transactions %}
<tr>
<td>{{ 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>
패킹 슬립 기본 템플릿
2024년 6월 6일 버전입니다.
liquid
<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 style="width: 15%; text-align: left;">Qty</th>
<th style="width: 85%; text-align: left;">Item</th>
</tr>
</thead>
<tbody>
{% for line_item in order.line_items %}
<tr>
<td style="text-align: left;">{{ line_item.quantity }}</td>
<td style="text-align: left;">{{ line_item.title }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>