Shopify

Zainstaluj widżet Agentkit w motywie Shopify, używając pełnego wygenerowanego kodu.

Dodaj widżet Agentkit do sklepu Shopify, wklejając pełny wygenerowany kod osadzania do pliku theme.liquid.

W Agentkit otwórz Kanały → Wtyczka na stronę → Widżet czatu, włącz kanał i skopiuj cały kod. Zawiera dwa znaczniki script: inicjalizację inline i asynchroniczny moduł ładujący. Zachowaj oba. Shopify zaleca powielenie motywu przed edycją kodu.

Metoda 1: edycja theme.liquid

Dodaj widżet do całej witryny, edytując opublikowany motyw:

  1. W panelu administracyjnym Shopify przejdź do Online Store → Themes.
  2. W wierszu aktywnego motywu kliknij menu ... (Actions) → Edit code.
  3. W folderze Layout po lewej stronie otwórz theme.liquid.
  4. Przewiń na sam dół i wklej kod do osadzenia tuż przed zamykającym tagiem </body>.
  5. Kliknij Save.

Wklej skopiowany kod bez zmian. Po zapisaniu sprawdź, czy oba znaczniki <script> są w wyrenderowanym kodzie źródłowym sklepu.

Widżet pojawia się na każdej stronie sklepu — produktu, kolekcji, koszyka i strony głównej.

Metoda 2: najpierw zduplikuj, potem edytuj (zalecana)

Jeśli chcesz mieć możliwość bezpiecznego wycofania zmian:

  1. Online Store → Themes.
  2. Na aktywnym motywie kliknij menu ... (trzy kropki) → Duplicate. Kopia pojawi się na dole listy motywów.
  3. Edytuj plik theme.liquid duplikatu tak jak powyżej.
  4. Kliknij menu ... przy duplikacie → Preview, aby przetestować.
  5. Gdy wszystko działa poprawnie, kliknij menu ... → Publish, aby opublikować zmiany.

Umieszczenie na jednej stronie

Aby pokazać widżet tylko na jednej stronie, poproś programistę motywu o ograniczenie obu wygenerowanych znaczników do szablonu strony. Sprawdź, czy są tylko tam. Edytor treści stron Shopify nie jest zweryfikowaną metodą instalacji tego widżetu.

Wymagania

  • Potrzebujesz dostępu do kodu motywu. Płatnego motywu w okresie próbnym nie można edytować przed zakupem. Rola musi mieć uprawnienia Themes i Edit code. Zobacz instrukcję Shopify dotyczącą kodu motywu.
  • Podczas testowania publicznego sklepu pozostaw włączony kanał Widżet czatu w Agentkit.
  • Jeśli używasz ograniczeń domen, zezwól na dokładny adres podglądu motywu i publicznego sklepu. Po testach usuń tymczasowy adres podglądu.

Po opublikowaniu

Jeśli widżet nie pojawia się w publicznym sklepie:

  1. Wykonaj twarde odświeżenie strony (⌘+Shift+R na Macu, Ctrl+F5 na Windows).
  2. Otwórz witrynę w oknie incognito.
  3. Sprawdź konsolę przeglądarki pod kątem błędów.

Rozwiązywanie problemów

Widżet się nie pojawia.

  • Upewnij się, że edytowałeś motyw aktywny (lub opublikowałeś duplikat).
  • Sprawdź, czy oba wygenerowane znaczniki script są przed </body> w wyrenderowanym kodzie źródłowym sklepu.
  • Zweryfikuj, czy domena Twojego sklepu jest dozwolona w Agent > Kanały > Zabezpieczenia.

Widżet nakłada się na czat Shopify lub panel koszyka.

  • Dostosuj pozycję widżetu w ustawieniach Wygląd swojego agenta.

Widżet pojawia się w edytorze, ale nie w aktywnym sklepie.

  • Upewnij się, że po wklejeniu kliknięto Save — edytor kodu nie zapisuje automatycznie.

Testowanie

  1. Otwórz swój sklep w oknie incognito.
  2. Sprawdź, czy w rogu widoczny jest dymek czatu.
  3. Kliknij, aby go otworzyć, i wyślij testową wiadomość.
  4. Sprawdź, czy oba wygenerowane znaczniki script są w kodzie źródłowym strony.

Połącz sklep, aby wyszukiwać zamówienia i produkty

Osadzenie widżetu i połączenie sklepu to dwie osobne sprawy. Powyższy kod do osadzenia umieszcza widżet czatu w Twoim sklepie. Osobne połączenie z Shopify — utworzone z zakładki Akcje → Integracje Twojego agenta — dodatkowo pozwala agentowi przeszukiwać Twój aktywny katalog i sprawdzać status zamówienia w trakcie rozmowy.

Możesz skorzystać z każdej z tych opcji osobno. Użyj samego osadzenia, jeśli agent ma odpowiadać wyłącznie na podstawie treści treningowych, i dodaj połączenie ze sklepem, gdy chcesz mieć dostęp do danych o produktach i zamówieniach na żywo.

Połączenie sklepu dostarcza tylko dane uwierzytelniające i samo w sobie niczego nie włącza: następnie dodaj w zakładce Akcje swojego agenta akcje Wyszukiwanie produktów i Status zamówienia, i włącz każdą z nich, której agent ma używać.

Skonfiguruj akcje Shopify →

Kolejne kroki