Wyświetlanie znaczka Shop Promise na stronie produktu

Znaczek Shop Promise jest wyświetlany obok dat dostawy i na stronach produktów dla kwalifikujących się dostaw, których termin realizacji na terenie Stanów Zjednoczonych wynosi maksymalnie pięć dni kalendarzowych. Ten znaczek informuje klientów, że dostawa ich zamówienia jest szybka i niezawodna.

Po zatwierdzeniu wniosku o aktywację usługi Shop Promise przejdź do strony produktu za pomocą edytora szablonów, aby potwierdzić, że znaczek Shop Promise wyświetla się poprawnie.

Jeśli znaczek nie wyświetla się poprawnie, musisz ręcznie umieścić moduł Shop Promise.

Ręcznie umieść moduł Shop Promise

Jeśli potrafisz odczytywać i edytować kod szablonu, możesz ustalić miejsca, w których należy wprowadzić zmiany i zaktualizować stronę produktu.

Ustal, gdzie należy wprowadzić zmiany

Kod modułu Shop Promise musi zostać uwzględniony w formularzu produktu na stronie produktu. Powinien wyglądać mniej więcej tak: {%- form 'product', product -%}. Moduł Shop Promise można znajdować się w różnych lokalizacjach w zależności od szablonu. Oto typowe lokalizacje:

  • main-product.liquid
  • product-form.liquid
  • product-template.liquid
  • product.liquid

Zaktualizuj stronę produktu

Kroki:

Pulpit
  1. W panelu administracyjnym Shopify przejdź do opcji: Sklep online > Szablony.
  2. Znajdź temat, który chcesz edytować, kliknij przycisk ..., aby otworzyć menu czynności, a następnie kliknij Edytuj kod.
  3. Otwórz odpowiedni plik.
  4. Znajdź linię zawierającą {%- if block.settings.show_dynamic_checkout -%} lub {{ form | payment_button }}.
  5. Utwórz nową linię bezpośrednio pod {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} i wklej w tej linii następujące informacje:
<div class="delivery-promise__promise-container"></div>
  1. Kliknij opcję Zapisz.

Wynik powinien być podobny do następującego:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>
iPhone
  1. W aplikacji Shopify naciśnij przycisk .
  2. W sekcji Kanały sprzedaży naciśnij Sklep online.
  3. Naciśnij Zarządzaj szablonami.
  4. Znajdź temat, który chcesz edytować, naciśnij przycisk ..., aby otworzyć menu czynności, a następnie naciśnij Edytuj kod.
  5. Otwórz odpowiedni plik.
  6. Znajdź linię zawierającą {%- if block.settings.show_dynamic_checkout -%} lub {{ form | payment_button }}.
  7. Utwórz nową linię bezpośrednio pod {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} i wklej w tej linii następujące informacje:
<div class="delivery-promise__promise-container"></div>
  1. Naciśnij opcję Zapisz.

Wynik powinien być podobny do następującego:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>
Android
  1. W aplikacji Shopify naciśnij przycisk .
  2. W sekcji Kanały sprzedaży naciśnij Sklep online.
  3. Naciśnij Zarządzaj szablonami.
  4. Znajdź temat, który chcesz edytować, naciśnij przycisk ..., aby otworzyć menu czynności, a następnie naciśnij Edytuj kod.
  5. Otwórz odpowiedni plik.
  6. Znajdź linię zawierającą {%- if block.settings.show_dynamic_checkout -%} lub {{ form | payment_button }}.
  7. Utwórz nową linię bezpośrednio pod {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} i wklej w tej linii następujące informacje:
<div class="delivery-promise__promise-container"></div>
  1. Naciśnij opcję Zapisz.

Wynik powinien być podobny do następującego:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>

Ręcznie zastąp szablon modułu Shop Promise

Moduł Shop Promise ma ciemny i jasny szablon. Moduł automatycznie wykorzystuje szablon, który ma najwyższy współczynnik kontrastu w porównaniu z kolorem tła strony produktu.

Jeśli nie masz problemu z czytaniem i edytowaniem kodu szablonu, możesz zastąpić wybrany szablon modułu, dodając atrybut danych do elementu zakotwiczenia używanego do ręcznego ustawiania modułu Shop Promise.

Zanim dokonasz zmian, zduplikuj swój szablon i edytuj go, aby zmiany można było łatwo cofnąć.

Kroki:

Pulpit
  1. Postępuj zgodnie z instrukcjami, aby ręcznie umieścić moduł Shop Promise na stronie produktu, a następnie pozostaw edytor szablonów otwarty.
  2. Dodaj atrybut danych szablonu do nowo utworzonego elementu zakotwiczonego, ustawionego jako ciemny lub jasny.
  3. Kliknij opcję Zapisz.

Wynik powinien wyglądać podobnie do:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Lub

<div class="delivery-promise__promise-container" data-theme="light"></div>
iPhone
  1. Postępuj zgodnie z instrukcjami, aby ręcznie umieścić moduł Shop Promise na stronie produktu, a następnie pozostaw edytor szablonów otwarty.
  2. Dodaj atrybut danych szablonu do nowo utworzonego elementu zakotwiczonego, ustawionego jako ciemny lub jasny.
  3. Naciśnij opcję Zapisz.

Wynik powinien wyglądać podobnie do:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Lub

<div class="delivery-promise__promise-container" data-theme="light"></div>
Android
  1. Postępuj zgodnie z instrukcjami, aby ręcznie umieścić moduł Shop Promise na stronie produktu, a następnie pozostaw edytor szablonów otwarty.
  2. Dodaj atrybut danych szablonu do nowo utworzonego elementu zakotwiczonego, ustawionego jako ciemny lub jasny.
  3. Naciśnij opcję Zapisz.

Wynik powinien wyglądać podobnie do:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Lub

<div class="delivery-promise__promise-container" data-theme="light"></div>
Nie możesz znaleźć odpowiedzi, których szukasz? Jesteśmy tutaj, aby Ci pomóc.