Anpassa mallar för Oder Printer

Du kan skapa och anpassa upp till 15 mallar för Order Printer-appen i din Shopify admin. Som standard innehåller appen Order Printer två mallar:

  • Faktura - en basfaktura som du kan skicka till en kund
  • Följesedel - en utskrift av din butiksadress och kundens leveransadress

Skapa en ny mall för Order Printer

Du måste känna till HTML, CSS och Liquid för att du ska kunna skapa en ny mall för Order Printer. Shopifys Temasupport kan hjälpa till med mindre justeringar inom omfånget för Shopifys designprinciper.

Steg:

  1. Gå till Inställningar > Appar och försäljningskanaler från Shopify-admin.

  2. Klicka på Order Printer för att öppna appen.

  3. Klicka på Hantera mallar.

  4. Klicka på Lägg till mall.

  5. Ange ett namn för din nya mall i namn-fältet.

  6. Lägg till HTML, CSS eller Liquid-kod i fältet kod för att skapa din mall.

  7. Klicka på Spara när du är klar.

Redigera en mall för Order Printer

Du måste känna till HTML, CSS och Liquid för att kunna redigera dina Order Printer-mallar. Shopifys Temasupport kan hjälpa till med mindre justeringar inom omfånget för Shopifys designprinciper.

Steg:

  1. Gå till Inställningar > Appar och försäljningskanaler från Shopify-admin.

  2. Klicka på Order Printer för att öppna appen.

  3. Klicka på Hantera mallar.

  4. Klicka på namnet på den mall du vill redigera.

  5. Gör ändringar i mallen genom att lägga till eller redigera HTML, CSS eller Liquid-kod i fältet Kod. Se Exempel på mallanpassningar för att förhandsgranska exempel på mallanpassningar.

  6. Klicka på Spara när du är klar.

Anpassningar av exempelmallar

Följande exempel förklarar några vanliga sätt att anpassa mallar för Order Printer:

Dator
  1. Gå till Innehåll > Filer från Shopify-admin.

  2. Klicka på Ladda upp filer och välj bildfilen på din dator.

  3. På sidan Filer hittar du den uppladdade filen och klickar på Kopiera URL.

  4. Klicka på Inställningar > Appar och försäljningskanaler från din Shopify-admin.

  5. Klicka på Order Printer för att öppna appen.

  6. Klicka på Hantera mallar.

  7. Klicka på namnet på den mall du vill redigera.

  8. Ange följande kodfragment i din mall där du vill att logotypen ska visas: <img src="your-image-URL">.

  9. Byt ut your-image-URL mot den bild-URL du kopierade. Beroende på var du vill att logotypen ska visas kan du behöva lägga till en <br/>-tagg för att lägga till en radbrytning före eller efter bilden.

iPhone
  1. Från Shopify-appen trycker du på knappen och sedan på Inställningar.
  2. Tryck på Filer i avsnittet Butiksinställningar.
  3. Klicka på Ladda upp filer och välj bildfilen på din dator.
  4. På sidan Filer hittar du den uppladdade filen och klickar på Kopiera URL.
  5. Klicka på Inställningar > Appar och försäljningskanaler från din Shopify-admin.
  6. Klicka på Order Printer för att öppna appen.
  7. Tryck på Hantera mallar.
  8. Blippa på namnet på den mall du vill redigera.
  9. Ange följande kodfragment i din mall där du vill att logotypen ska visas: <img src="your-image-URL">.
  10. Byt ut your-image-URL mot bildadressen du kopierade. Beroende på var du vill att logotypen ska visas kan du behöva lägga till en <br/>-tagg för att lägga till en radbrytning före eller efter din bild.
Android
  1. Från Shopify-appen trycker du på knappen och sedan på Inställningar.
  2. Tryck på Filer i avsnittet Butiksinställningar.
  3. Klicka på Ladda upp filer och välj bildfilen på din dator.
  4. På sidan Filer hittar du den uppladdade filen och klickar på Kopiera URL.
  5. Klicka på Inställningar > Appar och försäljningskanaler från din Shopify-admin.
  6. Klicka på Order Printer för att öppna appen.
  7. Tryck på Hantera mallar.
  8. Blippa på namnet på den mall du vill redigera.
  9. Ange följande kodfragment i din mall där du vill att logotypen ska visas: <img src="your-image-URL">.
  10. Byt ut your-image-URL mot bildadressen du kopierade. Beroende på var du vill att logotypen ska visas kan du behöva lägga till en <br/>-tagg för att lägga till en radbrytning före eller efter din bild.

Det ska se ut så här i HTML:

Example HTML code

Exempel: gör tabellbredder 100 %

Lägg till en table-tabular-klass till din tabell för att få dina tabeller att ha kantlinjer och sträcka sig till 100 % bredd:

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

Exempel: Visa produktminiatyrer

För att inkludera produktminiatyrer, lägg in den här koden i din mall:

{{ line_item.product.featured_image | product_img_url: 'thumb' | img_tag }}

Lägg till orderinformation

Observera: Följande anpassning kräver kunskap om HTML och Liquid.

Du kan lägga till orderinformation i dina mallar, till exempel namn, kvantitet och kostnad för varor som köps. Så här lägger du till orderinformation i din mall:

  1. Gå till Inställningar > Appar och försäljningskanaler från Shopify-admin.

  2. Klicka på Order Printer för att öppna appen.

  3. Klicka på Hantera mallar.

  4. Klicka på namnet på den mall du vill redigera.

  5. Använd Liquid-variabler för att lägga till orderinformation och HTML för att lägga till formatering. Till exempel skriver {{ line_item.price | money }} ut priset för artikeln.

  6. Klicka på Spara när du är klar.

Till exempel vill Nyla redigera sin följesedelels-mall för att inkludera en lista över de varor som skickas. Hon lägger till följande kod längst ner i Packing slip-mallen i Order Printer-appen:

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

Detta gör att Annas följesedlar nu kommer inkludera en tabell som listar köpta artiklar.

Hittar du inte de svar du letar efter? Vi finns här för att hjälpa till!