Personalizzazione dei modelli di Order Printer

Puoi creare e personalizzare fino a 15 modelli per l'app Order Printer nel pannello di controllo Shopify. Per impostazione predefinita, l'app Order Printer include due modelli:

  • Fattura: una fattura di base che puoi inviare a un cliente
  • Documento di trasporto: una stampa dell'indirizzo del tuo negozio e dell'indirizzo di spedizione del cliente

Crea un nuovo modello di Order Printer

Per creare un nuovo modello Order Printer è necessario avere familiarità con HTML, CSS e Liquid. L’Assistenza per i temi Shopify potrebbe aiutarti con piccole modifiche ai temi Shopify gratuiti nell’ambito della Policy di progettazione di Shopify. Se hai bisogno di modifiche più complesse o utilizzi un tema non realizzato da Shopify, valuta di assumere un Partner di Shopify.

Passaggi:

  1. Dal pannello di controllo Shopify, vai su App > Order Printer (legacy).

  2. Fai clic su Gestisci modelli.

  3. Fai clic su Aggiungi modello.

  4. Inserisci un nome per il nuovo modello nel campo Nome.

  5. Aggiungi codice HTML, CSS o Liquid nel campo Codice per creare il modello.

  6. Al termine, fai clic su Salva.

Modifica un modello di Order Printer

Per modificare i modelli Order Printer è necessario avere familiarità con HTML, CSS e Liquid. L’Assistenza per i temi Shopify non può apportare modifiche estese ai modelli al posto tuo, ma potrebbe aiutarti con piccole modifiche ai temi Shopify gratuiti nell’ambito della Policy di progettazione di Shopify. Per modifiche più complesse, valuta di assumere un Partner di Shopify.

Passaggi:

  1. Dal pannello di controllo Shopify, vai su App > Order Printer (legacy).

  2. Fai clic su Gestisci modelli.

  3. Fai clic sul nome del modello che desideri modificare.

  4. Apporta le modifiche al modello aggiungendo o modificando il codice HTML, CSS o Liquid nel campo Codice. Per visualizzare in anteprima esempi di personalizzazione dei modelli, consulta la sezione Esempi di personalizzazione dei modelli.

  5. Al termine, fai clic su Salva.

Esempi di personalizzazione dei modelli

I seguenti esempi illustrano alcuni modi comuni per personalizzare i modelli di Order Printer:

Desktop
  1. Dal pannello di controllo Shopify, vai a Contenuti > File.

  2. Fai clic su Carica file e seleziona il file immagine sul computer.

  3. Nella pagina File, individua il file caricato e fai clic su Copia URL.

  4. Dal pannello di controllo Shopify, fai clic su Impostazioni > App.

  5. Fai clic su Order Printer per aprire l'app.

  6. Fai clic su Gestisci modelli.

  7. Fai clic sul nome del modello che desideri modificare.

  8. Inserisci il seguente frammento di codice nel modello nel punto in cui desideri che appaia il logo: <img src="tuo-URL-immagine">.

  9. Sostituisci tuo-URL-immagine con l'URL dell'immagine che hai copiato. A seconda di dove desideri visualizzare il logo, potresti dover aggiungere un tag <br/> per inserire un'interruzione di riga prima o dopo l'immagine.

Mobile
  1. Dall'app Shopify, tocca l'icona Menu.

  2. Nel menu Contenuti, tocca l'icona freccia giù, quindi tocca File.

  3. Tocca Carica file e seleziona il file immagine sul computer.

  4. Nella pagina File, individua il file caricato e tocca Copia URL.

  5. Dal pannello di controllo Shopify, tocca Impostazioni > App.

  6. Tocca Order Printer per aprire l'app.

  7. Tocca Gestisci modelli.

  8. Tocca il nome del modello che desideri modificare.

  9. Inserisci il seguente frammento di codice nel modello nel punto in cui desideri che appaia il logo: <img src="tuo-URL-immagine">.

  10. Sostituisci tuo-URL-immagine con l'URL dell'immagine che hai copiato. A seconda di dove desideri visualizzare il logo, potresti dover aggiungere un tag <br/> per inserire un'interruzione di riga prima o dopo l'immagine.

Dovrebbe avere questo aspetto in HTML:

Esempio di codice HTML

Esempio: imposta la larghezza delle tabelle al 100%

Per fare in modo che le tabelle abbiano i bordi e si estendano al 100% della larghezza, aggiungi una classe table-tabular alla tabella:

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

Esempio: mostra anteprime dei prodotti

Per includere le anteprime dei prodotti, inserisci questo codice nel modello:

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

Aggiungi dettagli dell'ordine

Puoi aggiungere ai modelli i dettagli dell'ordine, come nome, quantità e costo degli articoli acquistati. Per aggiungere i dettagli dell'ordine al modello:

  1. Dal pannello di controllo Shopify, vai su App > Order Printer (legacy).

  2. Fai clic su Gestisci modelli.

  3. Fai clic sul nome del modello che desideri modificare.

  4. Utilizza le variabili Liquid per aggiungere i dettagli dell'ordine e l'HTML per aggiungere la formattazione. Ad esempio, {{ line_item.price | money }} stampa il prezzo dell'articolo.

  5. Al termine, fai clic su Salva.

Ad esempio, se Nyla vuole modificare il modello di documento di trasporto per includere un elenco degli articoli in spedizione, aggiunge il seguente codice in fondo al modello Documento di trasporto nell'app Order Printer:

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

Di conseguenza, i documenti di trasporto di Nyla ora includono una tabella che elenca gli articoli acquistati.