Opdatering af dine Liquid-skabeloner til Shopify-scripts

Hvis du kører scripts i din webshop, skal du tjekke, hvordan de påvirker siderne i dit butikslayout. Mange temaer indeholder kode, der understøtter dine scripts, men det gør nogle ikke. Hvis dit tema ikke har koden, kan du tilføje den.

På denne side

Fejlfinding

De fleste problemer med scripts og temaer involverer varelinjescripts, der giver rabatter. Den samlede pris for ordren kan f.eks. være korrekt, men priserne på varelinjerne viser ikke rabatterne. Kunderne skal kunne forstå, hvordan deres rabatter beregnes. De vil gerne se den oprindelige pris og prisen med rabat samt en kort beskrivelse af rabatten. Hvis nogen af disse oplysninger mangler i din indkøbskurv, skal du tilføje Liquid-koden, så de vises.

En god måde at kontrollere, hvordan dit script påvirker dit butikslayout, er at besøge din butik som kunde og udføre de handlinger, der udløser scriptet.

Attributter for Liquid-objekter

Følgende lister indeholder attributter for Liquid-objekter, som ofte er nødvendige for at understøtte scripts i din butiks indkøbskurv:

Attributter for indkøbskurvobjekt:

Attributter for varelinje:

Script-objekt:

script-objektet kan bruges til at returnere oplysninger om en butiks aktive scripts. Dette objekt kan være nyttigt ved fejlfinding af scripts.

Eksempel

Følgende eksempel beskriver de ændringer, du kan foretage i din cart.liquid-skabelon for at understøtte et varelinjescript.

Eksempel på indkøbskurv

Hvis du f.eks. har en indkøbskurv med tre varelinjer:

Fodbold
- Antal: 1
- Enhedspris: 15,00 USD
Tennisbold
- Antal: 5
- Enhedspris: 5,00 USD
Løbesko
- Antal: 1
- Enhedspris: 30,00 USD

Og du har udgivet et script, der anvender følgende rabatter:

10 % rabat ved køb af to eller flere tennisbolde
5 USD i rabat på alle sko

Så er din cart.liquid-skabelon måske en simpel tabel, der viser varelinjerne og et resume af deres samlede beløb:

<table class="cart">
  <thead class="heading">
    <tr>
      <th>Product</th>
      <th>Quantity</th>
      <th>Total</th>
    </tr>
  </thead>

  <tbody class="line-items">
    {% for item in cart.items %}
    <tr>
      <td>{{ item.product.title }}</td>
      <td>{{ item.quantity }}</td>
      <td>{{ item.line_price | money }}</td>
    </tr>
    {% endfor %}
  </tbody>

  <tfoot class="summary">
    <tr>
      <td colspan="2">Total</td>
      <td>{{ cart.total_price | money }}</td>
    </tr>
  </tfoot>
</table>

Med de rabatter, der anvendes af scriptet, opretter denne skabelon følgende tabel til din indkøbskurv:

Produkt	Antal	I alt
Fodbold	1	15,00 USD
Tennisbold	5	22,50 USD
Løbesko	1	25,00 USD
I alt		62,50 USD

Opdater varelinjerne

For at vise de rabatter, der anvendes af scriptet, skal du opdatere varelinjerne, så de viser tre vigtige oplysninger:

varelinjens pris før rabatter
varelinjens pris efter rabatter
en besked, der beskriver de anvendte rabatter.

For at gøre dette skal du bruge følgende attributter for Liquid-objekter:

line_item.total_discount returnerer det rabatbeløb, der er blevet anvendt på varelinjen
line_item.original_line_price returnerer varelinjens pris før rabatter
line_item.message returnerer en besked, der beskriver de rabatter, der blev anvendt på varelinjen.

Det kan være en hjælp at skelne mellem den oprindelige varelinjepris og prisen med rabat ved at bruge en gennemstregning:

<tbody class="line-items">
  {% for item in cart.items %}
  <tr>
    <td>{{ item.product.title }}</td>
    <td>{{ item.quantity }}</td>
    <td>
      {{ item.line_price }}
      {% if item.total_discount > 0 %}
        <s>{{ item.original_line_price }}</s>
        ( {{ item.message }} )
      {% endif %}
    </td>
  </tr>
  {% endfor %}
</tbody>

Din indkøbskurv bør nu se sådan ud:

Produkt	Antal	I alt
Fodbold	1	15,00 USD
Tennisbold	5	22,50 USD ~~25,00 USD~~ (10 % rabat ved køb af to eller flere tennisbolde)
Løbesko	1	25,00 USD ~~30,00 USD~~ (5 USD i rabat på alle sko)
I alt		62,50 USD

Opdater resumeet for indkøbskurven

For at hjælpe kunden med at holde styr på sin ordrepris bør du også vise:

indkøbskurvens oprindelige subtotal, så kunderne kan sammenligne totalbeløbet før og efter rabat
den samlede besparelse, kunden har opnået i sin indkøbskurv.

Du skal igen bruge følgende attributter for Liquid-objekter for at tilføje disse oplysninger:

cart.total_discount returnerer det rabatbeløb, der er anvendt på varer i indkøbskurven
cart.original_total_price returnerer subtotalen for indkøbskurven før rabatter.

Med disse oplysninger kan din opdaterede .summary-blok se sådan ud:

<tfoot class="summary">
  <tr>
    <td colspan="2">Subtotal</td>
    <td>{{ cart.original_total_price | money }}</td>
  </tr>
  <tr>
    <td colspan="2">Discount Savings</td>
    <td>{{ cart.total_discount | money }}</td>
  </tr>
  <tr>
    <td colspan="2">Total</td>
    <td>{{ cart.total_price | money }}</td>
  </tr>
</tfoot>

Din indkøbskurvtabel bør nu se sådan ud:

Produkt	Antal	I alt
Fodbold	1	15,00 USD
Tennisbold	5	22,50 USD ~~25,00 USD~~ (10 % rabat ved køb af to eller flere tennisbolde)
Løbesko	1	25,00 USD ~~30,00 USD~~ (5 USD i rabat på alle sko)
Subtotal		70,00 USD
Rabatbesparelser		7,50 USD
I alt		62,50 USD

Ved at føje et par nye Liquid-objekter til dine skabeloner kan du hjælpe dine kunder med at forstå, hvordan deres rabatter beregnes.

Andre eksempler

Følgende Liquid-eksempel viser rabatterne for hver varelinje:

{% if item.original_line_price != item.line_price %}
  <small class="original-price"><s>{{ item.original_line_price | money }}</s></small>
  {% endif %}
  {{ item.line_price | money }}
  {% for discount in item.discounts %}
  <small class="discount">{{ discount.title }}</small>
  {% endfor %}

Se et andet rabateksempel, der indeholder ændringerne i Liquid-koden.