Créer et personnaliser des modèles Shopify Order Printer

Vous pouvez créer et personnaliser jusqu’à 15 modèles pour l’application Shopify Order Printer dans votre interface administrateur Shopify. Par défaut, l’application Shopify Order Printer comprend deux modèles :

  • Invoice (Facture) : une facture de base que vous pouvez envoyer à un client
  • Packing slip (Bordereau d’expédition) : une version imprimée de l'adresse de votre boutique et de l'adresse d'expédition de votre client

Créer un nouveau modèle Shopify Order Printer

Pour créer un nouveau modèle Shopify Order Printer, il est nécessaire de connaître les langages HTML, CSS et Liquid. L’assistance pour les thèmes Shopify peut vous aider à apporter des modifications mineures dans le cadre de la politique en matière de conception de Shopify.

Étapes :

  1. Dans votre interface administrateur Shopify, cliquez sur Paramètres > Applications et canaux de vente.

  2. Cliquez sur Order Printer.

  3. Cliquez sur Modèles.

  4. Cliquez sur Ajouter un modèle.

  5. Saisissez un nom pour votre modèle dans le champ Name (Nom).

  6. Insérez le code HTML, CSS ou Liquid dans le champ Code pour créer votre modèle.

  7. Cliquez sur Enregistrer.

Modifier un modèle Shopify Order Printer

Pour modifier les modèles Shopify Order Printer, il est nécessaire de connaître les langages HTML, CSS et Liquid. L’assistance pour les thèmes Shopify peut vous aider à apporter des modifications mineures dans le cadre de la politique en matière de conception de Shopify.

Étapes :

  1. Dans votre interface administrateur Shopify, cliquez sur Paramètres > Applications et canaux de vente.

  2. Cliquez sur Order Printer.

  3. Cliquez sur Modèles.

  4. Cliquez sur le nom du modèle que vous souhaitez modifier.

  5. Mettez à jour le modèle en ajoutant ou en modifiant du code HTML, CSS ou Liquid dans le champ Code. Pour en savoir plus sur les personnalisations de modèles, consultez Exemples de personnalisations de modèles.

  6. Cliquez sur Enregistrer.

Exemples de personnalisations de modèles

Examinez les exemples suivants d’utilisation pour apprendre à personnaliser les modèles Shopify Order Printer :

Examinez l’exemple suivant qui montre la façon dont votre code HTML devrait s’afficher après avoir ajouté votre logo à votre modèle de commande :

Example HTML code

Faire en sorte que la largeur des tableaux soit de 100 %

Pour ajouter des bordures à votre tableau et l’étendre à 100 % de largeur, ajoutez une classe table-tabular à votre tableau :

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

Afficher des vignettes de produits

Pour ajouter des vignettes de produit à votre modèle de commande, insérez le code suivant dans votre modèle :

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

Ajouter les détails de la commande

Il est possible d'ajouter des détails de la commande à vos modèles, tels que le nom, la quantité et le prix des articles achetés.

Étapes :

  1. Dans votre interface administrateur Shopify, cliquez sur Paramètres > Applications et canaux de vente.

  2. Cliquez sur Order Printer.

  3. Cliquez sur Modèles.

  4. Cliquez sur le nom du modèle que vous souhaitez modifier.

  5. Utilisez des variables Liquid pour ajouter des détails de commande et du code HTML pour la mise en forme. Par exemple, l’utilisation du code {{ line_item.price | money }} permet d’imprimer le prix de l’article.

  6. Cliquez sur Enregistrer.

Par exemple, Nyla souhaite modifier son modèle de bordereau d’expédition pour inclure une liste des articles à expédier. Elle ajoute le code suivant en bas de son modèle Packing slip dans l’application Shopify Order Printer :

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

En conséquence, les bordereaux d'emballage de Nyla incluent désormais un tableau répertoriant les articles achetés.

Prêt(e) à commencer à vendre avec Shopify ?

Essayez gratuitement