Skapa och redigera mallar med Shopify Order Printer

Du kan skapa och redigera mallar med appen Shopify Order Printer i din Shopify admin. Som standard innehåller appen Shopify Order Printer följande mallar:

Faktura: En faktura som du kan skicka till en kund
Följesedel: En utskrift av din butiks adress och din kunds leveransadress.
Plocklista: Ett dokument som innehåller en lista över artiklar som behöver plockas för att distribuera din kunds order.

Du kan använda Liquid för att skapa dina egna anpassade mallar för andra förpackningsbilagor, till exempel kuponger, etiketter eller kvitton. Appen Shopify Order Printer har stöd för mallar som har skapats med HTML, CSS och Liquid-variabler.

På den här sidan

Att tänka på när du skapar mallar i appen Shopify Order Printer

Tänk på följande innan du skapar mallar i appen Shopify Order Printer:

För att skapa eller redigera mallar i appen Shopify Order Printer måste du vara bekant med HTML, CSS och Liquid. Shopifys temasupport kan eventuellt hjälpa till med mindre justeringar av gratis Shopify-teman inom ramen för Shopifys designpolicy. Om du behöver göra mer komplexa ändringar eller använder ett tema som inte skapats av Shopify kan du överväga att anlita en Shopify-partner.
Du kan skapa upp till 15 olika mallar.
Se referens för Liquid-variabler och filter för Shopify Order Printer för alla anpassningar av mallar som stöds.

Skapa en mall

Du kan skapa en ny mall för ditt orderdokument.

Information om hur du konfigurerar en plocklistemall finns i Konfigurera och skriva ut plocklistor med appen Shopify Order Printer.

Steg:

Gå till Appar > Order Printer från din Shopify admin.
Klicka på Mallar.
Klicka på Skapa en mall.
Ange ett namn på din mall i fältet Namn, till exempel etikett eller kupong.
I avsnittet Redigera kod lägger du till HTML-, CSS- eller Liquid-kod för att skapa din mall.
Valfritt: Klicka på Förhandsgranska för att förhandsgranska din mall.
Klicka på Spara.

Redigera en mall

Du kan redigera en befintlig mall. Läs mer om att anpassa Order Printer-mallar.

Steg:

Gå till Appar > Order Printer från din Shopify admin.
Klicka på Mallar.
Klicka på den mall som du vill redigera.
Lägg till eller redigera HTML-, CSS- eller Liquid-kod i avsnittet Redigera kod.
Valfritt: Klicka på Förhandsgranska för att förhandsgranska din mall.
Klicka på Spara.

Återställa standardmallen

Du kan återställa de inbyggda mallarna för följesedlar och fakturor till deras standardvärden. Använd följande kodblock för att återställa dina mallar till standard.

Standardmall för faktura

Version från 6 juni 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>

Standardmall för följesedel

Version från 6 juni 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>