Zasób JavaScript dla statusu zamówienia

Uwaga

To jest zaawansowany tutorial, który nie jest obsługiwany przez Shopify. Wymagana jest znajomość języków projektowania stron internetowych, takich jak HTML, CSS, JavaScript i Liquid. Sugerujemy zatrudnienie partnera Shopify, jeśli nie czujesz się pewnie, korzystając z poniższego tutoriala.

Uwaga

Dodatkowe skrypty do dostosowania strony statusu zamówienia są nieaktualne.

Sprzedawcy korzystający z planów Basic, Shopify i Advanced mogą dostosować stronę statusu zamówienia za pomocą edytora stron realizacji zakupu i kont. Sprzedawcy Shopify Plus mogą korzystać z funkcji Checkout Extensibility, aby dostosować stronę statusu zamówienia.

Możesz dodać niestandardową treść do strony statusu zamówienia za pomocą zasobu JavaScript statusu zamówienia Shopify.Checkout.OrderStatus, np. - uwagi dotyczące określonych produktów - instrukcje dotyczące poszczególnych metod wysyłki - linki do pobrania produktów cyfrowych

Aby dodać ten zasób Javascript w panelu administracyjnym Shopify, przejdź do opcji: Ustawienia > Realizacja zakupu. Przewiń w dół do sekcji Strona statusu zamówienia, a następnie dodaj zasób Javascript w polu Dodatkowe skrypty.

Dostęp do tego zasobu JavaScript można również uzyskać poprzez ScriptTag.

Jak to działa

Shopify.Checkout.OrderStatus zawiera funkcję do generowania nowej zawartości:

addContentBox(params)

Funkcja ta umożliwia dodanie pola zawartości, w którym każdy parametr przekazany do funkcji jest renderowany jako osobny wiersz.

Język HTML5 jest obsługiwany wewnątrz funkcji, a poza nią można używać języka liquid.

Przykład

Możesz dodać treść, jeśli użyta została konkretna metoda wysyłki. Ten kod dodaje godziny pracy sklepu do strony statusu zamówienia, gdy klient wybierze metodę wysyłki – odbiór w sklepie.

<script>
  {% if checkout.shipping_method.title == 'Pick-up at the store' %}
    Shopify.Checkout.OrderStatus.addContentBox(
     '<h2>Pick-up in store</h2>',
     '<p>We are open everyday from 9am to 5pm.</p>'
    )
  {% endif %}
</script>