Pakbonnen aanpassen

Je kunt de template van je pakbonnen aanpassen. Door de template te wijzigen, kun je je eigen branding toevoegen en de look-and-feel van de pakbon veranderen.

Winkeladres wijzigen

Als je je winkeladres wilt bewerken of wijzigen, ga dan naar Instellingen > Algemeen en bewerk je winkelinformatie.

Als je alleen het adres op je pakbonnen wilt wijzigen, volg dan de onderstaande stappen.

Stappen:

1. Ga in het Shopify-beheercentrum naar Instellingen > Verzending en bezorging.

2. Klik in de sectie Documenten op Pakbontemplate.

3. Zoek de Liquid-variabele {{ shop_address.summary }} die naar je winkeladres verwijst. Als je deze variabele niet kunt vinden, probeer dan de volgende:

{{ shop_address.address1 }}, {{ shop_address.city }}, {{ shop_address.province_code }}, {{ shop_address.zip }}, {{ shop_address.country }}

4. Selecteer deze code en verwijder deze.
5. Typ het gewenste adres voor je pakbonnen in deze lege ruimte. Je adres kan er bijvoorbeeld zo uitzien: 123 Example Street, New York, NY, 10000, United States
6. Klik op Templatevoorbeeld om je wijzigingen te bekijken.
7. Klik op Opslaan.

Productafbeeldingen verwijderen

Je kunt de afbeeldingen van je producten verwijderen die naast de producttitels op je pakbonnen worden weergegeven.

Stappen:

1. Ga in het Shopify-beheercentrum naar Instellingen > Verzending en bezorging.

2. Klik in de sectie Documenten op Pakbontemplate.

3. Zoek de volgende Liquid-variabelen die naar je productafbeeldingen verwijzen:

{% if line_item.image != blank %}
       <div class="flex-line-item-img">
         <div class="aspect-ratio aspect-ratio-square" style="width: {{ desired_image_size }}px; height: {{ desired_image_size }}px;">
           {{ line_item.image | img_url: effective_image_dimensions | img_tag: '', 'aspect-ratio__content' }}
         </div>
       </div>
       {% endif %}

4. Selecteer deze code en verwijder deze.
5. Klik op Templatevoorbeeld om je wijzigingen te bekijken.
6. Klik op Opslaan.

Logo bewerken

Voordat je je winkellogo toevoegt aan je pakbonnen, moet je je logo uploaden naar je Shopify-beheercentrum. Noteer na het uploaden de naam van het geüploade bestand om deze later in de pakbontemplate te gebruiken.

Nadat je je logo naar je winkel hebt geüpload, kun je je logo toevoegen en je winkelnaam verwijderen, je logo boven je winkelnaam toevoegen of je logo naast je winkelnaam toevoegen.

Stappen:

1. Ga in het Shopify-beheercentrum naar Content > Bestanden.

2. Klik op Bestanden uploaden.

3. Selecteer en upload je winkellogo vanaf je apparaat.

4. Noteer de bestandsnaam wanneer de upload is voltooid, inclusief de bestandsextensie (bijvoorbeeld .png of .jpg).

Logo toevoegen en winkelnaam verwijderen

Je kunt je winkelnaam verwijderen en vervangen door je winkellogo bovenaan je pakbonnen.

Stappen:

1. Ga in het Shopify-beheercentrum naar Instellingen > Verzending en bezorging.

2. Klik in de sectie Documenten op Pakbontemplate.

3. Zoek de volgende code die naar je winkelnaam verwijst:

<p class="to-uppercase">
  {{ shop.name }}
</p>

4. Selecteer deze code en verwijder deze.
5. Typ in de ruimte die je hebt aangemaakt de volgende code met de bestandsnaam die je eerder hebt geüpload:

{{ 'FILE NAME' | file_img_url: 'small' | img_tag: 'Logo' }}

Het filter file_img_url genereert de URL voor het geüploade bestand met de opgegeven grootte, en het filter img_tag maakt een HTML-afbeeldingstag met de alt-tekst die je opgeeft.

Als het geüploade bestand bijvoorbeeld shop_logo.png is, is de bijbehorende Liquid-code:

{{ 'shop_logo.png' | file_img_url: 'small' | img_tag: 'Logo' }}

6. Selecteer Templatevoorbeeld om je wijzigingen te bekijken.
7. Klik op Opslaan.

Logo boven winkelnaam toevoegen

Als je je logo boven je winkelnaam wilt toevoegen bovenaan je pakbonnen, volg dan de onderstaande stappen.

Stappen:

1. Ga in het Shopify-beheercentrum naar Instellingen > Verzending en bezorging.

2. Klik in de sectie Documenten op Pakbontemplate.

3. Zoek de volgende Liquid-variabele die verwijst naar je winkelnaam en voeg een regeleinde toe tussen de twee regels:

<div class="shop-title">
      |
      <p class="to-uppercase">

4. Typ in de ruimte die je hebt aangemaakt de volgende code met de bestandsnaam die je eerder hebt geüpload (bijvoorbeeld shop_logo.png):

{{ 'FILE NAME' | file_img_url: 'small' | img_tag: 'Logo' }}
<br>

5. Selecteer Templatevoorbeeld om je wijzigingen te bekijken.
6. Klik op Opslaan.

Logo naast winkelnaam toevoegen

Als je je logo naast je winkelnaam wilt toevoegen bovenaan je pakbonnen, volg dan de onderstaande stappen.

Stappen:

1. Ga in het Shopify-beheercentrum naar Instellingen > Verzending en bezorging.

2. Klik in de sectie Documenten op Pakbontemplate.

3. Zoek de volgende Liquid-variabele die naar je winkelnaam verwijst:

<p class="to-uppercase">
{{ shop.name }}
</p>

4. Selecteer deze code en verwijder deze.
5. Typ in de ruimte die je hebt aangemaakt de volgende code met de bestandsnaam die je eerder hebt geüpload (bijvoorbeeld shop_logo.png):

{{ 'FILE NAME' | file_img_url: 'small' | img_tag: 'Logo' }}
<span class="to-uppercase">
  {{ shop.name }}
</span>

6. Zoek de volgende Liquid-variabelen:

.shop-title {
  -webkit-box-flex: 6;
  -webkit-flex: 6;
  flex: 6;
  font-size: 1.9em;
}

7. Voeg een nieuwe regel toe aan het einde van de hierboven vermelde variabelen en plak de volgende code:

.shop-title img {
 vertical-align: middle;
}

.shop-title span {
 vertical-align: middle;
}

8. Selecteer Templatevoorbeeld om je wijzigingen te bekijken.
9. Klik op Opslaan.

Pakbonnen opmaken met CSS

Je kunt je pakbon aanpassen met de CSS-bestanden die je naar Shopify uploadt. CSS-bestanden die buiten Shopify worden gehost, worden niet correct weergegeven.

Stappen:

1. Ga in het Shopify-beheercentrum naar Content > Bestanden.

2. Klik op Bestanden uploaden.

3. Selecteer en upload je CSS-bestand.

4. Kopieer de bestands-URL wanneer de upload is voltooid.

5. Voeg de volgende code toe:

<link
  rel="stylesheet"
  type="text/css"
  href="https://cdn.shopify.com/path_to_file/styles.css"
>