Edytor kodu drukowanego paragonu dla Shopify POS

Możesz dostosować drukowane paragony za pomocą edytora kodu w panelu administracyjnym Shopify. Pliki, z których składają się paragony, zawierają Liquid — język szablonów Shopify. Za pomocą edytora kodu można tworzyć bardziej zaawansowane dostosowania przy użyciu języków HTML, CSS i Liquid niż za pomocą edytora wizualnego.

Możesz zmienić szablon paragonu i szablony sekcji używane na drukowanych paragonach. Pliki szablonów Paragony to typy paragonów, które można drukować w sklepie. Sekcje to części paragonów, takie jak nagłówek lub stopka. Sekcje mogą być ponownie wykorzystywane w wielu rodzajach paragonów.

Kwestie do rozważenia dotyczące używania edytora kodu paragonu

Przed rozpoczęciem korzystania z edytora kodu paragonu zapoznaj się z poniższymi kwestiami:

Ograniczenia dostępu

• Możesz użyć edytora kodu tylko w panelu administracyjnym Shopify na komputerze.
• Edytor kodu nie jest dostępny dla lokalizacji POS we Włoszech.

Gdzie mają zastosowanie zmiany

• Zmiany w kodzie, które wprowadzasz, dotyczą tylko wybranej lokalizacji.
• Dostosowania w edytorze kodu mają zastosowanie tylko do lokalizacji POS Pro. Jeśli używasz edytora kodu i masz lokalizacje inne niż POS Pro, możesz użyć edytora wizualnego, aby dostosować nagłówek i stopkę dla tych lokalizacji.
• Możesz dostosować drukowane paragony, które mają szablon w edytorze kodu, takie jak paragony sprzedaży, paragony prezentowe, paragony z kartami prezentowymi oraz paragony zwrotów i wymian.

Języki kodu

• Pliki, z których składają się paragony, zawierają Liquid — język szablonów Shopify. Dowiedz się więcej o używaniu języka Liquid.
• Aby edytować szablony w edytorze kodu paragonów, musisz znać języki HTML, CSS i Liquid. Pomoc techniczna Shopify w zakresie szablonów może pomóc w drobnych modyfikacjach w zakresie Polityki projektowej Shopify.

Ograniczenia dostosowywania

• Z poziomu edytora kodu nie można przeglądać podglądu paragonów w rozmiarach dostosowanych do różnych drukarek. Aby zobaczyć podgląd dla konkretnego rozmiaru drukarki, użyj edytora wizualnego.
• Opisy produktów nie są dostępne jako zmienna w szablonach paragonów i nie można ich dodawać do drukowanych paragonów.

Zarządzanie szablonem

• Jeśli dostosujesz paragon za pomocą edytora kodu, w istniejącym szablonie może zabraknąć nowych właściwości, takich jak selling_plan_name. Aby dodać do szablonu najnowsze dostępne właściwości, musisz zresetować szablon paragonu do ustawień domyślnych. Zresetowanie szablonów paragonów do ustawień domyślnych powoduje usunięcie wszystkich wprowadzonych modyfikacji. Przed zresetowaniem należy zapisać swój dostosowany kod. Po zresetowaniu szablonu konieczne będzie ponowne, ręczne zastosowanie dostosowań.

Dostęp do edytora kodu

Możesz edytować szablony za pomocą edytora kodu. Musisz najpierw przełączyć się na edytor kodu z domyślnego edytora wizualnego i w każdej chwili możesz przełączyć się z powrotem na edytor wizualny.

Kroki przełączania się między edytorami różnią się nieznacznie w zależności od tego, czy z edytora kodu mogą korzystać wszystkie Twoje lokalizacje POS, czy tylko niektóre z nich (np. część Twoich lokalizacji POS nie korzysta z subskrypcji POS Pro lub znajduje się we Włoszech lub we Francji).

Kroki:

Użyj niestandardowych plików w szablonie paragonu

Możesz używać plików, takich jak zasoby graficzne, przesyłanych do panelu administracyjnego Shopify, aby dostosować drukowane paragony.

Plik musi zostać przesłany do panelu administracyjnego Shopify, zanim będzie można go użyć w drukowanym paragonie. Dowiedz się więcej o przesyłaniu plików.

Kroki:

1. W panelu administracyjnym Shopify przejdź do opcji Zawartość > Pliki.

2. Obok pliku, który chcesz umieścić w kodzie drukowanego paragonu, kliknij ikonę , aby skopiować link.

3. Przejdź do edytora kodu.

4. Wstaw link do zasobu w szablonie.

Zresetuj szablon paragonu do ustawień domyślnych

Możesz zresetować szablon paragonu do wersji domyślnej za pomocą edytora kodu.

Kroki:

Zmienne Liquid dostępne w edytorze kodu paragonów

Możesz użyć języka Liquid, aby dostosować szablon drukowanego paragonu i typy paragonów.

Następujące obiekty danych są dostępne w edytorze kodu paragonów:

Obiekty paragonu

shop

location

order

return

gift_card

Obiekt Zamówienie

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

Obiekt zwrotu

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

Obiekt grupy wysyłki

destination

products

Obiekt pozycji pojedynczej

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

Obiekt zwracanej pozycji pojedynczej

Zawiera wszystko z obiektu pozycji pojedynczej oraz następujące właściwości:

return_reason

return_reason_note

Filtry Liquid dostępne w edytorze kodu paragonu

Możesz używać filtrów Liquid do wprowadzania korekt w informacjach zawartych w szablonach paragonów. Możesz na przykład zmienić formatowanie waluty lub wielkość liter określonego tekstu, takiego jak kod podatku.

Aby zastosować filtr, dodaj znak potoku |, a następnie filtr w bloku kodu Liquid, między podwójnymi nawiasami klamrowymi {{ }}. Filtry można stosować tylko do bloków kodu Liquid.

W poniższym przykładzie filtr zmienia kod podatku z małych na wielkie litery.

{{ tax_line.title | upcase }}

W przykładowym bloku kodu product to obiekt, title to jego właściwość, a upcase to zastosowany filtr. Filtr upcase zmienia wielkość liter wartości tax_line.title na wielkie. Na przykład, jeśli tax_line.title ma wartość Hst, filtr upcase zmieni ją na HST.

Zapoznaj się z sekcją Filtry w dokumentacji Liquid dla szablonów Shopify, aby uzyskać szczegółowe informacje na temat korzystania z filtrów Liquid.

W edytorze kodu paragonu dostępne są następujące filtry:

t

money

escape

barcode

qrcode

Przykład dostosowania kodu szablonu drukowanego paragonu

Możesz używać języka Liquid do dodawania warunkowych komunikatów. Ta funkcjonalność jest podobna do zapisywania w jednej lokalizacji za pomocą edytora wizualnego. Na przykład, jeśli Twoja firma zaczynała od jednej lokalizacji, a teraz masz kilka nowych, możesz chcieć wyróżnić swój pierwotny sklep na drukowanych paragonach.

Możesz dodać niestandardowy komunikat do szablonu header.liquid w folderze Sekcje edytora kodu i użyć języka Liquid, aby wyświetlić komunikat tylko dla Twojej flagowej lokalizacji.

Poniższy kod sprawdza nazwę lokalizacji — w tym przypadku pierwotnej lokalizacji o nazwie „Strona główna” — i wyświetla komunikat „Witamy w naszym pierwotnym sklepie otwartym w 1972 r.”, jeśli lokalizacja pasuje do nazwy. Na paragonach drukowanych w innych lokalizacjach będzie zamiast tego wyświetlany komunikat „Witamy w naszym sklepie”.

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

Podgląd zmian w kodzie w edytorze kodu

Możesz wyświetlić podgląd zmian w drukowanych paragonach w edytorze kodu POS w panelu administracyjnym Shopify.

W zależności od wybranego pliku Liquid okno podglądu podświetla projekt lub sekcję paragonu, na którą ma wpływ plik. Domyślnie w oknie podglądu wyświetlana jest zawartość ostatniego zamówienia z POS. Możesz wybrać określone zamówienie, którego zawartość paragonu ma być użyta w oknie podglądu dla wszystkich plików Liquid z wyjątkiem pliku gift-card.liquid, dla którego jako opcje podglądu do wyboru wyświetlane są tylko różne lokalizacje.

Kroki: