Éditeur de code des reçus imprimés pour votre Shopify POS

Vous pouvez personnaliser vos reçus imprimés à l’aide de l’éditeur de code dans votre interface administrateur Shopify. Les fichiers qui composent vos reçus contiennent du Liquid, le langage de modélisation de Shopify. L’éditeur de code vous permet de créer des personnalisations plus avancées en utilisant du code HTML, CSS et Liquid qu’avec l’éditeur visuel.

Vous pouvez modifier le modèle de reçu et les modèles de section utilisés sur vos reçus imprimés. Les fichiers du modèle de Reçus sont les types de reçus que vous pouvez imprimer dans votre boutique. Les Sections sont des parties des reçus, comme l’en-tête ou le pied de page. Les sections peuvent être réutilisées par plusieurs reçus.

Considérations relatives à l’utilisation de l’éditeur de code des reçus

Avant d’utiliser l’éditeur de code des reçus, examinez les considérations suivantes :

Restrictions d’accès

• Vous pouvez utiliser l’éditeur de code uniquement depuis votre interface administrateur Shopify sur un ordinateur de bureau.
• L’éditeur de code n’est disponible pour aucun emplacement POS en Italie ou en France.

Où les modifications s’appliquent

• Les modifications de code que vous apportez s’appliquent uniquement à l’emplacement sélectionné.
• Les personnalisations dans l’éditeur de code s’appliquent uniquement aux emplacements POS Pro. Si vous utilisez l’éditeur de code et que vous avez des emplacements qui n’utilisent pas POS Pro, vous pouvez utiliser l’éditeur visuel pour personnaliser l’en-tête et le pied de page de ces emplacements.
• Vous pouvez personnaliser les reçus imprimés qui ont un modèle dans l’éditeur de code, tels que les reçus de vente, les reçus de cadeau, les reçus de carte-cadeau et les reçus de retour et d’échange.

Langages de code

• Les fichiers qui composent vos reçus contiennent du Liquid, le langage de modélisation de Shopify. En savoir plus sur l’utilisation de Liquid.
• Pour modifier les modèles dans l’éditeur de code des reçus, vous devez bien connaître le HTML, le CSS et Liquid. L’assistance technique pour les thèmes Shopify ne peut pas modifier vos modèles de reçu de manière approfondie, mais elle peut vous aider à apporter des modifications mineures aux thèmes Shopify gratuits dans le cadre de la Politique de conception de Shopify. Pour des modifications plus complexes, envisagez d’engager un Partenaire Shopify.

Limites de personnalisation

• Vous ne pouvez pas prévisualiser les reçus dans différentes tailles d’imprimante depuis l’éditeur de code. Pour les prévisualiser par taille d’imprimante, utilisez l’éditeur visuel.
• Les descriptions de produits ne sont pas disponibles en tant que variable dans les modèles de reçus et ne peuvent pas être ajoutées aux reçus imprimés.

Maintenance du modèle

• Si vous personnalisez un reçu avec l’éditeur de code de reçu, de nouvelles propriétés, telles que selling_plan_name, pourraient manquer dans votre modèle existant. Pour ajouter les dernières propriétés disponibles à votre modèle, vous devez réinitialiser votre modèle de reçu aux paramètres par défaut. La réinitialisation des modèles de reçus à leurs paramètres par défaut supprime toutes les personnalisations que vous y avez apportées. Prenez note de votre code personnalisé avant de procéder à la réinitialisation. Après avoir réinitialisé le modèle, vous devez réappliquer manuellement vos personnalisations.

Accéder à l’éditeur de code

Vous pouvez modifier vos modèles à l’aide de l’éditeur de code. Vous devez d’abord passer à l’éditeur de code à partir de l’éditeur visuel par défaut, et vous pouvez revenir à l’éditeur visuel à tout moment.

Les étapes pour passer d’un éditeur à l’autre diffèrent légèrement selon que tous vos emplacements POS sont admissibles à l’éditeur de code, ou que seuls certains de vos emplacements POS le sont. Par exemple, si certains de vos emplacements POS n’utilisent pas POS Pro ou sont situés en Italie ou en France.

Étapes :

Utiliser des fichiers personnalisés dans votre modèle de reçu

Vous pouvez utiliser des fichiers, tels que des ressources d’images, que vous chargez dans votre interface administrateur Shopify pour personnaliser vos reçus imprimés.

Un fichier doit être importé dans votre interface administrateur Shopify avant de pouvoir être utilisé dans un reçu imprimé. En savoir plus sur l’importation de fichiers.

Étapes :

1. Depuis votre interface administrateur Shopify, accédez à Contenu > Fichiers.

2. À côté du fichier que vous souhaitez inclure dans le code de votre reçu imprimé, cliquez sur pour copier le lien.

3. Accès à l’éditeur de code.

4. Incluez le lien de la ressource dans votre modèle.

Réinitialiser votre modèle de reçu par défaut

Vous pouvez rétablir la version par défaut d’un modèle de reçu à l’aide de l’éditeur de code.

Étapes :

Variables Liquid disponibles dans l’éditeur de code des reçus

Vous pouvez utiliser Liquid pour personnaliser votre modèle de reçu imprimé et vos types de reçus.

Les objets de données suivants sont disponibles dans l’éditeur de code des reçus :

Objets de reçu

shop

location

order

return

gift_card

Objet de commande

id

created_at

source_identifier

change_due

balance_due

name

note

line_items

subtotal_price

total_price

total_tip_received

discounts

transactions

taxes_included

tax_lines

customer

shipping_address

shipping_groups

Objet de retour

name

created_at

is_unverified

is_exchange

exchange_type

return_discount

return_subtotal

return_total

exchange_subtotal

exchange_total

total_cash_rounding_adjustment

total_adjusted_amount

net_total

return_line_items

exchange_line_items

return_tax_lines

exchange_tax_lines

shipping_refund_amount

tip_refund_amount

transactions

Objet de groupe d’expédition

destination

products

Objet d’article du panier

id

name

variant_title

price

is_gift_card

discount

total_price

selling_plan_name

tax_rates

custom_attributes

variant_title

variant_id

variant_metafields

staff_member_description

product_metafields

Objet d’article du panier retourné

Inclut tout ce qui se trouve dans l’objet d’article du panier, ainsi que les propriétés suivantes :

return_reason

return_reason_note

Filtres Liquid disponibles dans l’éditeur de code de reçu

Vous pouvez utiliser les filtres Liquid pour ajuster les informations dans vos modèles de reçus. Par exemple, vous pouvez modifier le formatage de la devise ou la mise en majuscules d’un texte spécifique, tel qu’un code de taxe.

Pour appliquer un filtre, ajoutez une barre verticale |, puis le filtre dans le bloc de code Liquid entre les doubles accolades {{ }}. Les filtres ne peuvent être appliqués qu’aux blocs de code Liquid.

Dans l’exemple suivant, le filtre convertit le code de taxe de minuscules en majuscules.

{{ tax_line.title | upcase }}

Dans l’exemple de bloc de code, product est l’objet, title est sa propriété et upcase est le filtre appliqué. Le filtre upcase met en majuscules la valeur de tax_line.title. Par exemple, si la valeur de tax_line.title est Hst, le filtre upcase la convertit en HST.

Consultez la section Filtres de la documentation de référence Liquid pour les thèmes Shopify pour en savoir plus sur l’utilisation des filtres Liquid.

Les filtres suivants sont disponibles dans l’éditeur de code de reçu :

t

money

escape

barcode

qrcode

Exemple de personnalisation du code du modèle de reçu imprimé

Vous pouvez utiliser Liquid pour ajouter une messagerie conditionnelle. Cette fonctionnalité est similaire à l’enregistrement pour un seul emplacement avec l’éditeur visuel. Par exemple, votre entreprise a démarré avec un seul emplacement et vous disposez désormais de plusieurs nouveaux emplacements. Vous souhaitez mettre en évidence votre boutique d’origine sur vos reçus imprimés.

Vous pouvez ajouter un message personnalisé au modèle header.liquid dans le dossier Sections de l’éditeur de code, et utiliser Liquid pour afficher le message uniquement pour votre emplacement phare.

Le code suivant vérifie le nom de l’emplacement, dans ce cas votre emplacement d’origine appelé « Home », et affiche le message « Bienvenue dans notre boutique d’origine, ouverte en 1972. » si le nom de l’emplacement correspond. Les reçus imprimés depuis vos autres emplacements affichent plutôt le message « Bienvenue dans notre boutique. ».

{% if location.name == 'Home' %}
  Welcome to our original store, opened in 1972.
{% else %}
  Welcome to our store.
{% end %}

Aperçu de vos modifications de code dans l’éditeur de code

Vous pouvez prévisualiser les modifications apportées à vos reçus imprimés dans l’éditeur de code POS de l’interface administrateur Shopify.

Selon le fichier Liquid sélectionné, la fenêtre d’aperçu met en surbrillance la partie du reçu (design ou section) modifiée par le fichier. Par défaut, la fenêtre d’aperçu affiche le contenu de votre commande POS la plus récente. Vous pouvez sélectionner une commande spécifique à utiliser comme contenu de reçu dans la fenêtre d’aperçu pour tous les fichiers Liquid, à l’exception du fichier gift-card.liquid, qui n’affiche que les différents emplacements en tant qu’options d’aperçu sélectionnables.

Étapes :