Order Printer -mallien mukauttaminen

Tämä sivu on tulostettu Nov 28, 2023. Nykyinen versio on osoitteessa https://help.shopify.com/fi/manual/orders/order-printer/customizing-order-templates.

Shopify Adminissa voit luoda ja mukauttaa jopa 15 mallia Order Printer -sovellusta varten. Oletusarvoisesti Order Printer -sovellus sisältää kaksi mallia:

  • Lasku - peruslasku, jonka voit lähettää asiakkaalle
  • Pakkausluettelo - tuloste, jossa on kaupan osoite ja asiakkaan toimitusosoite

Tällä sivulla

Uuden Order Printer -mallin luominen

Uuden Order Printer -mallin luominen edellyttää, että olet perehtynyt HTML:ään, CSS:ään ja Liquidiin. Shopifyn teematuki voi auttaa tekemään pieniä muutoksia Shopifyn suunnittelukäytännön mukaisesti.

Tee näin:

  1. Klikkaa Shopify adminissa Asetukset > Sovellukset ja myyntikanavat.

  2. Avaa sovellus klikkaamalla Order Printer.

  3. Klikkaa Hallinnoi malleja.

  4. Klikkaa Lisää malli.

  5. Syötä uuden mallisi nimi Nimi-kenttään.

  6. Luo malli lisäämällä HTML-, CSS- tai Liquid-koodia koodi-kenttään.

  7. Kun olet valmis, klikkaa Tallenna.

Order Printer -mallin muokkaaminen

Order Printer -malliesi muokkaaminen edellyttää, että olet perehtynyt HTML:ään, CSS:ään ja Liquidiin. Shopifyn teematuki voi auttaa tekemään pieniä muutoksia Shopifyn suunnittelukäytännön mukaisesti.

Tee näin:

  1. Klikkaa Shopify adminissa Asetukset > Sovellukset ja myyntikanavat.

  2. Avaa sovellus klikkaamalla Order Printer.

  3. Klikkaa Hallinnoi malleja.

  4. Klikkaa sen mallin nimeä, jota haluat muokata.

  5. Tee muutoksia malliin lisäämällä tai muokkaamalla HTML-, CSS- tai Liquid-koodia Koodi-kentässä. Jos haluat esikatsella esimerkkejä mallien mukauttamisesta, tutustu kohtaan Esimerkkejä mallien mukauttamisesta.

  6. Kun olet valmis, klikkaa Tallenna.

Esimerkkejä mallien mukauttamisesta

Seuraavissa esimerkeissä selitetään joitakin tyypillisiä tapoja mukauttaa Order Printer -malleja:

  1. Siirry Shopify Administa kohtaan Sisältö > Tiedostot.
  2. Valitse lataa tiedostot ja valitse kuvatiedosto tietokoneeltasi.
  3. Etsi ladattu tiedosto Tiedostot-sivulta ja klikkaa Kopioi URL-osoite.
  4. Valitse Shopify Adminissa Asetukset > Sovellukset ja myyntikanavat.
  5. Avaa sovellus klikkaamalla Order Printer.
  6. Klikkaa Hallinnoi malleja.
  7. Klikkaa sen mallin nimeä, jota haluat muokata.
  8. Syötä seuraava koodinpätkä mallissasi kohtaan, jossa haluat logosi näkyvän: <img src="your-image-URL">.
  9. Korvaa your-image-URL kopioimallasi kuvan URL-osoitteella. Riippuen siitä, mihin haluat logosi sijoittaa, saatat joutua lisäämään <br/>-tunnisteen, jotta voit lisätä rivinvaihdon ennen kuvaa tai sen jälkeen.
  1. Napauta Shopify-sovelluksessa …-painiketta ja napauta sen jälkeen Asetukset.
  2. Napauta Kaupan asetukset -osiossa valintaa Tiedostot.
  3. Valitse lataa tiedostot ja valitse kuvatiedosto tietokoneeltasi.
  4. Etsi ladattu tiedosto Tiedostot-sivulta ja klikkaa Kopioi URL-osoite.
  5. Valitse Shopify Adminissa Asetukset > Sovellukset ja myyntikanavat.
  6. Avaa sovellus klikkaamalla Order Printer.
  7. Klikkaa Hallinnoi malleja.
  8. Klikkaa sen mallin nimeä, jota haluat muokata.
  9. Syötä seuraava koodinpätkä mallissasi kohtaan, jossa haluat logosi näkyvän: <img src="your-image-URL">.
  10. Korvaa your-image-URL kopioimallasi URL-osoitteella. Riippuen siitä, mihin haluat logosi sijoittaa, saatat joutua lisäämään <br/>-tunnisteen, jotta voit lisätä rivinvaihdon ennen kuvaa tai sen jälkeen.
  1. Napauta Shopify-sovelluksessa …-painiketta ja napauta sen jälkeen Asetukset.
  2. Napauta Kaupan asetukset -osiossa valintaa Tiedostot.
  3. Valitse lataa tiedostot ja valitse kuvatiedosto tietokoneeltasi.
  4. Etsi ladattu tiedosto Tiedostot-sivulta ja klikkaa Kopioi URL-osoite.
  5. Valitse Shopify Adminissa Asetukset > Sovellukset ja myyntikanavat.
  6. Avaa sovellus klikkaamalla Order Printer.
  7. Klikkaa Hallinnoi malleja.
  8. Klikkaa sen mallin nimeä, jota haluat muokata.
  9. Syötä seuraava koodinpätkä mallissasi kohtaan, jossa haluat logosi näkyvän: <img src="your-image-URL">.
  10. Korvaa your-image-URL kopioimallasi URL-osoitteella. Riippuen siitä, mihin haluat logosi sijoittaa, saatat joutua lisäämään <br/>-tunnisteen, jotta voit lisätä rivinvaihdon ennen kuvaa tai sen jälkeen.

Sen pitäisi näyttää tältä HTML:ssä:

Example HTML code

Esimerkki: Taulukoiden leveyden asettaminen 100 %:iin

Jos haluat, että taulukoillasi on rajat ja että niiden leveys on 100 %, lisää taulukkoon table-tabular-luokka:

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

Esimerkki: Näytä tuotteen pikkukuvat

Jos haluat liittää tuotteeseen pikkukuvan, lisää malliisi tämä koodi:

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

Lisää tilaustiedot

Voit lisätä malleihin tilaustietoja, kuten ostettujen tuotteiden nimiä, määriä ja hintoja. Tilaustietojen lisääminen malliin:

  1. Klikkaa Shopify adminissa Asetukset > Sovellukset ja myyntikanavat.

  2. Avaa sovellus klikkaamalla Order Printer.

  3. Klikkaa Hallinnoi malleja.

  4. Klikkaa sen mallin nimeä, jota haluat muokata.

  5. Käytä Liquid-muuttujia tilaustietojen ja HTML-koodia muotoilujen lisäämistä varten. Esimerkiksi {{ line_item.price | money }} tulostaa tuotteen hinnan.

  6. Kun olet valmis, klikkaa Tallenna.

Jos Nyla haluaa esimerkiksi muokata pakkausluettelomallia niin, että se sisältää lähetettävät tuotteet, hän lisää Packing slip-mallin alaosaan Order Printer -sovelluksessa seuraavan koodin:

<br>
<br>
<table class="table-tabular" style="margin: 0 0 1.5em 0;">
  <thead>
    <tr>
      <th>Quantity</th>
      <th>Item</th>
      {% if show_line_item_taxes %}
      <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>

Tämän jälkeen Nylan pakkausluetteloissa on taulukko, jossa näkyy ostetut tuotteet.

Valmiina aloittamaan Shopifyssa?

Kokeile ilmaiseksi