Sådan opretter og redigerer du skabeloner ved hjælp af Shopify Order Printer
Du kan oprette og redigere skabeloner via Shopify Order Printer-appen i din Shopify-administrator. Som standard indeholder Shopify Order Printer-appen de følgende skabeloner:
- Faktura: En faktura, som du kan sende til en kunde
- Pakkeseddel: en udskrift af din butiksadresse og din kundes leveringsadresse.
Du kan bruge Liquid til at oprette dine egne tilpassede skabeloner til andre materialer, der lægges i pakken, som f.eks. kuponer, labels og kvitteringer. Shopify Order Printer-appen understøtter skabeloner, der er lavet med HTML-, CSS- og Liquid-variabler.
På denne side
Overvejelser i forbindelse med oprettelse af skabeloner i Shopify Order Printer-appen
Gennemgå følgende overvejelser, før du opretter skabeloner i Shopify Order Printer-appen:
- Hvis du vil oprette eller redigere skabeloner i Shopify Order Printer-appen, skal du have kendskab til HTML, CSS og Liquid. Shopifys support til temaer kan hjælpe dig med mindre justeringer inden for omfanget af Shopifys designpolitik.
- Du kan oprette op til 15 forskellige skabeloner.
- Se Referencer for Liquid-variabler og -filtre til Shopify Order Printer for alle understøttede skabelontilpasninger.
Opret en skabelon
Du kan oprette en ny skabelon til dit ordredokument.
Trin:
- Klik på Indstillinger > Apps- og Salgskanaler i Shopify-administrator.
- Klik på Order Printer.
Klik på Åbn app.
Klik på Skabeloner.
Klik på Opret en skabelon.
Indtast et navn for din skabelon, som f.eks. label eller kupon, i feltet Navn.
Tilføj HTML-, CSS- eller Liquid-kode i afsnittet Rediger kode for at oprette din skabelon.
Valgfrit: Klik på Forhåndsvisning for at se en forhåndsvisning af din skabelon.
Klik på Gem.
Rediger en skabelon
Du kan redigere en eksisterende skabelon. Du kan få mere at vide om skabelontilpasninger i Eksempler på skabelontilpasninger.
Trin:
- Klik på Indstillinger > Apps- og Salgskanaler i Shopify-administrator.
- Klik på Order Printer.
Klik på Åbn app.
Klik på Skabeloner.
Klik på den skabelon, du vil redigere.
Tilføj eller rediger HTML-, CSS- eller Liquid-kode i afsnittet Rediger kode.
Valgfrit: Klik på Forhåndsvisning for at se en forhåndsvisning af din skabelon.
Klik på Gem.
Sådan gendanner du standardskabelonen
Du kan gendanne de indbyggede skabeloner til pakkesedler og fakturaer til deres standardværdier. Brug følgende kodeblokke til at gendanne dine skabeloner til standard.
Standardskabelon til faktura
Version fra 6. juni 2024.
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 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>
Standardskabelon til pakkeseddel
Version fra 6. juni 2024.
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 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>