Aktualizowanie szablonów Liquid dla skryptów
Jeśli wykonujesz skrypty w sklepie online, musisz sprawdzić, w jaki sposób wpływają one na strony w witrynie Twojego sklepu. Wiele szablonów zawiera kod do obsługi skryptów, ale niektóre nie. Jeśli Twój szablon nie ma kodu, możesz go dodać.
Rozwiązywanie problemów
Większość problemów ze skryptami i szablonami dotyczy skryptów pozycji pojedynczych oferujących rabaty. Na przykład całkowita cena zamówienia jest poprawna, ale dla cen pozycji nie wyświetlają się rabaty. Klienci muszą wiedzieć, w jaki sposób obliczane są ich rabaty. Chcą widzieć pierwotną i obniżoną cenę, a także krótki opis rabatu. Jeśli którejś z tych informacji brakuje w koszyku, musisz dodać kod Liquid, aby się pojawiła.
Dobrym sposobem na sprawdzenie, w jaki sposób skrypt wpływa na Twoją witrynę sklepową, jest odwiedzenie sklepu w roli klienta i wykonanie działań uruchamiających skrypt.
Atrybuty obiektu Liquid
Poniższe listy zawierają atrybuty obiektu Liquid, które są zwykle potrzebne do obsługi skryptów w koszyku w Twoim sklepie:
Atrybuty obiektu koszyka:
Atrybuty pozycji pojedynczych:
- line_item.discounts
- line_item.message
- line_item.original_price
- line_item.original_line_price
- line_item.total_discount
Obiekt skryptu:
- Obiekt skryptu może służyć do zwracania informacji o aktywnych skryptach sklepu. Ten obiekt może być przydatny podczas debugowania skryptów.
Przykład
W poniższym przykładzie opisano zmiany, które można wprowadzić w szablonie cart.liquid w celu obsługi skryptu pozycji pojedynczych.
Przykładowy koszyk
Na przykład, jeśli Twój koszyk zawiera trzy pozycje:
Piłka nożna - Ilość: 1 - Cena jednostkowa: 15,00 zł
Piłka tenisowa - Ilość: 5 - Cena jednostkowa: 5,00 zł
Buty do biegania - Ilość: 1 - Cena jednostkowa: 30,00 zł
I opublikowałeś(-aś) skrypt, który stosuje następujące rabaty:
- 10% rabatu na dwie lub więcej piłek tenisowych
- 5 zł rabatu na wszystkie buty
Twój szablon cart.liquid
może być prostą tabelą zawierającą pozycje i podsumowanie ich łącznych kwot:
<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>
Biorąc pod uwagę rabaty zastosowane przez skrypt, szablon ten tworzy poniższą tabelę dla Twojego koszyka:
Produkt | Ilość | Suma |
---|---|---|
Piłka nożna | 1 | 15,00 zł |
Piłka tenisowa | 5 | 22,50 zł |
Buty do biegania | 1 | 25,00 zł |
Suma | 62,50 zł |
Zaktualizuj pozycje pojedyncze
Aby wyświetlić rabaty zastosowane przez skrypt, musimy zaktualizować pozycje pojedyncze, aby wyświetlić trzy kluczowe informacje:
- cena pozycji przed rabatami
- cena pozycji po rabatach
- wiadomość z opisem rabatów, które zostały zastosowane.
W tym celu użyj następujących atrybutów obiektu Liquid:
line_item.total_discount
zwraca kwotę rabatu zastosowanego do pozycjiline_item.original_line_price
zwraca cenę pozycji przed rabatamiline_item.message
zwraca wiadomość opisującą rabaty, które zostały zastosowane do pozycji.
Dzięki zastosowaniu przekreślenia można lepiej odróżnić pierwotną cenę pozycji od obniżonej ceny pozycji:
<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>
Twój koszyk powinien teraz wyglądać następująco:
Produkt | Ilość | Suma |
---|---|---|
Piłka nożna | 1 | 15,00 zł |
Piłka tenisowa | 5 | 22,50 zł |
Buty do biegania | 1 | 25,00 zł |
Suma | 62,50 zł |
Zaktualizuj podsumowanie koszyka
Aby pomóc klientowi śledzić cenę ich zamówienia, należy również pokazać:
- pierwotną sumę częściową koszyka, aby umożliwić klientom porównywanie sum przed i po rabacie
- łączną kwotę oszczędności dokonanych przez klienta przy zakupie produktów z koszyka.
Aby dodać te informacje, należy użyć poniższych atrybutów obiektu Liquid:
cart.total_discount
zwraca kwotę rabatu zastosowanego do pozycji w koszykucart.original_total_price
zwraca sumę częściową koszyka przed rabatami.
Po uwzględnieniu tych informacji zaktualizowany blok .summary
może wyglądać następująco:
<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>
Tabela koszyka powinna teraz wyglądać następująco:
Produkt | Ilość | Suma |
---|---|---|
Piłka nożna | 1 | 15,00 zł |
Piłka tenisowa | 5 | 22,50 zł |
Buty do biegania | 1 | 25,00 zł |
Suma częściowa | 70,00 zł | |
Oszczędności rabatowe | 7,50 $ | |
Suma | 62,50 zł |
Dodając kilka nowych obiektów Liquid do szablonów, możesz zapoznać swoich klientów ze sposobem obliczania ich rabatów.
Inne przykłady
Poniższy przykład Liquid pokazuje rabaty dla każdej pozycji:
{% 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 %}
Zobacz inny przykład rabatu, który zawiera zmiany kodu Liquid