Code-editor voor papieren bronnen

Je kunt de papieren bronnen aanpassen met de code-editor in het Shopify-beheercentrum. Met de code-editor kun je geavanceerdere aanpassingen maken met HTML, CSS en Liquid dan met de visuele editor.

Je kunt de bontemplate en de sectietemplates wijzigen die op de papieren bonnen worden gebruikt. De bestanden van de Bonnen-template zijn het soort bonnen dat je in je winkel kunt afdrukken. Secties zijn delen van de bonnen, zoals de kop- of voettekst. Secties kunnen door meerdere bonnen worden hergebruikt.

Aandachtspunten bij het gebruik van de codebewerker voor bonnen

Lees de volgende aandachtspunten voordat je de boncode-editor gebruikt:

  • Je kunt de codebewerker alleen via het Shopify-beheercentrum op een desktop gebruiken.
  • De codewijzigingen die je aanbrengt, zijn van toepassing op alle POS Pro-locaties. Maar je kunt voorwaarden toevoegen om aanpassingen voor specifieke locaties weer te geven. Lees meer over het gebruik van controlestroom-tags met Liquid.
  • Wanneer je overschakelt naar de code-editor, kun je vanuit de Shopify POS-app geen aanpassingen maken aan de bontemplate. Je kunt nog wel je afdrukopties aanpassen vanuit de Shopify POS-app voor locaties met het POS Pro-abonnement.
  • Aanpassingen in de code-editor zijn alleen van toepassing op POS Pro-locaties. Als je de code-editor gebruikt en POS Lite-locaties hebt, kun je de visuele editor gebruiken om de kop- en voettekst voor je Lite-locaties aan te passen.
  • De bestanden die voor je bonnen worden gebruikt bevatten Liquid, de templatetaal van Shopify. Lees meer over werken met Liquid.
  • Je kunt alleen templates bewerken in de codebewerker voor bonnen als je bekend bent met HTML, CSS en Liquid. Shopify Theme Support kan helpen met kleine aanpassingen binnen het kader van het ontwerpbeleid van Shopify.
  • Sommige soorten papieren bonnen kunnen niet worden aangepast.
  • De code-editor is niet beschikbaar voor locaties in Italië.

Aandachtspunten bij incompatibiliteit voor bepaalde soorten bonnen

Sommige soorten papieren bonnen kunnen niet worden aangepast in de boncode-editor. De soorten bonnen waarvoor de code-editor geen template heeft, kunnen niet worden aangepast.

Je kunt de volgende soorten papieren bonnen aanpassen:

  • verkoopbonnen;
  • bonnen voor cadeaubonnen;
  • aankoopbewijzen van cadeaubonnen.

Je kunt de volgende bonnen niet aanpassen:

  • retourbonnen;
  • bonnen voor omruilingen.

Bovendien komen geen van de bontypen voor locaties in Italië in aanmerking voor aanpassing.

Toegang tot de code-editor

Je kunt je templates bewerken met behulp van de code-editor.

Stappen:

  1. Ga in het Shopify-beheercentrum naar Instellingen > Apps en verkoopkanalen.

  2. Klik op de pagina Apps en verkoopkanalen op Point of sale.

  3. Klik op Verkoopkanaal openen.

  4. Klik op Instellingen > Aanpassing van bonnen.

  5. Klik op Bonnen aanpassen.

  6. Klik op ... > Code bewerken.

  7. Klik in het dialoogvenster Code bewerken op Code bewerken.

Aangepaste bestanden gebruiken in je bontemplate

Je kunt je bonnen aanpassen met bestanden die je uploadt. Als je je eigen afbeeldingen op je bonnen wil afdrukken, kun je ze naar het Shopify-beheercentrum uploaden en ze vervolgens op je aangepaste bonnen gebruiken. Lees meer over het uploaden van bestanden.

Stappen:

  1. Ga in het Shopify-beheercentrum naar Instellingen > Apps en verkoopkanalen.

  2. Klik op de pagina Apps en verkoopkanalen op Point of sale.

  3. Klik op Verkoopkanaal openen.

  4. Klik op Instellingen > Aanpassing van bonnen.

  5. Klik op Bonnen aanpassen.

  6. Klik op de pagina Content.

  7. Kopieer de link naast het bestand dat je in je bontemplate wil gebruiken.

  8. Voeg de link in je template toe.

Je bontemplate terugzetten naar de standaardinstellingen

Je kunt een bontemplate op de standaardversie terugzetten met behulp van de code-editor.

Stappen:

  1. Ga in het Shopify-beheercentrum naar Instellingen > Apps en verkoopkanalen.

  2. Klik op de pagina Apps en verkoopkanalen op Point of sale.

  3. Klik op Verkoopkanaal openen.

  4. Klik op Instellingen > Aanpassing van bonnen.

  5. Klik op de template die je opnieuw wil instellen.

  6. Klik op het pictogram Opnieuw instellen.

  7. Klik in het modale venster Het bestand opnieuw instellen op standaardwaarden op Opnieuw instellen om te bevestigen.

Liquid-variabelen die in de boncode-editor beschikbaar zijn

Je kunt Liquid gebruiken om de template voor papieren bonnen en bontypen aan te passen.

De volgende gegevensobjecten zijn beschikbaar voor de boncode-editor:

Beschrijving van bongegevensobjecten
ObjectBeschrijving
shop
Bevat de winkelgegevens, zoals de winkelnaam.
location
Bevat de winkellocatiegegevens, bijvoorbeeld adres en telefoonnummer.
order
Bevat de bestelgegevens, inclusief de orderregels, kortingen, belastingen en transactiegegevens.
gift_card
Alleen beschikbaar in de template gift_card.liquid. Bevat de cadeaubongegevens, waaronder het saldo, de alfanumerieke code en de content van een QR-code die door de POS-app kan worden gescand.

Liquid-filters die beschikbaar zijn in de codebewerker voor bonnen

Je kunt liquid-filters gebruiken om informatie in je bontemplates aan te passen. Je kunt bijvoorbeeld de indeling van valuta of het hoofdlettergebruik van specifieke tekst wijzigen, zoals een belastingcode.

Als je een filter wil toepassen, voeg dan een pipe-teken | en dan het filter toe binnen het blok liquid-code tussen accolades {{ }}. Filters kunnen alleen worden toegepast op blokken liquid-code.

In het volgende voorbeeld gebruik je het filter om de belastingcode van kleine letters in hoofdletters te wijzigen.

{{ tax_line.title | upcase }}

In het voorbeeldcodeblok is product het object, title de eigenschap en upcase het toegepaste filter. Het upcase-filter verandert de letters van de waarde van tax_line.title in hoofdletters. Als tax_line.title bijvoorbeeld de waarde Hst heeft, verandert het upcase-filter de waarde in HST.

Zie de sectie Filters in de Shopify Themes Liquid-naslag voor meer informatie over het gebruik van Liquid-filters.

De volgende filters zijn beschikbaar in de boncode-editor:

Beschrijving van bonfilters
EigenschappenBeschrijving
t
Vertaalt vooraf gedefinieerde labels naar de taal die aan je locatie is toegewezen.
money
Geeft de prijs aan in de valuta van je locatie.
escape
Escapet speciale tekens in HTML, zoals <>, ' en &, en zet de tekens om in escape-sequenties.
barcode
Genereert een SVG met 1D-barcode.
qrcode
Genereert een SVG met 2D-barcode.

Voorbeeld van een aanpassing van een templatecode voor papieren bonnen

Je kunt Liquid gebruiken om berichten met voorwaarden toe te voegen. Deze functionaliteit is vergelijkbaar met het opslaan op één locatie met de visuele editor. Je bedrijf is bijvoorbeeld met één locatie gestart en je hebt nu verschillende nieuwe locaties. Je wil je eerste winkel op je papieren bonnen uitlichten.

Je kunt een aangepast bericht toevoegen aan de header.liquid-template in de map Secties van de code-editor en Liquid gebruiken om het bericht alleen weer te geven voor je flagship store.

De volgende code controleert op de naam van de locatie, in dit geval je eerste locatie die je 'Startlocatie' hebt genoemd, en geeft het bericht 'Welkom in onze eerste winkel, geopend in 1972' weer als de locatie overeenkomt met die naam. Op bonnen die op je andere locaties zijn afgedrukt, staat het bericht 'Welkom in onze winkel'.

{% if location.name == 'Home' %}
  Welcome to our original store, opened in 1972.
{% else %}
  Welcome to our store.
{% end %}
Zat het antwoord dat je zocht er niet bij? Wij helpen je graag verder.