DOCS

Install

/

Zainstaluj Hello legacy

Dowiedz się, jak zainstalować Hello na stronie swojego sklepu.

Jeśli korzystasz z Shopify, BigCommerce, Magento, Miva lub X-Cart, przeczytaj odpowiednią stronę integracji wtyczki.

Poniższy skrypt doda flagę Zonos Hello do Twojej strony, rozpozna kraj, z którego odwiedzają Cię klienci, powita ich i poda ogólne informacje o cłach i podatkach dla ich kraju (podstawowe).

Dodatkowe funkcje są dostępne przy minimalnej pracy deweloperskiej (pokazane poniżej).

Dodaj Hello do swojej strony 

1

Dodaj skrypt Hello - podstawowy

Dodanie tego skryptu do kodu Twojej strony doda flagę Zonos Hello do Twojej witryny, rozpozna kraj, z którego odwiedzają Cię klienci, powita ich i poda ogólne informacje o cłach i podatkach dla ich kraju.

UMIEJĘTNOŚCI POTRZEBNE: Podstawowe umiejętności internetowe

Aby zainstalować Hello, wprowadź niestandardowy skrypt zawierający Twój unikalny klucz witryny na swojej stronie przed zamykającym tagiem body.

Hello skrypt integracyjny

1
<script src="https://hello.zonos.com/hello.js?siteKey=YOURSITEKEY"></script>

Zonos Hello musi być załadowany przed dodaniem jakiejkolwiek dodatkowej funkcjonalności. Proszę dołączyć wszelkie dodatkowe funkcje po powyższym skrypcie.

Nie masz jeszcze skryptu? Kliknij tutaj, aby pobrać.

2

Generowanie szacunkowych opłat celnych i podatków

UMIEJĘTNOŚCI POTRZEBNE: Podstawowe umiejętności programistyczne

Gdy ta funkcja jest włączona, Hello może dostarczać szacunkowe opłaty celne i podatki, gdy produkt jest wyświetlany lub dodawany do koszyka. Hello może również wyświetlać pełne wyceny opłat celnych i podatków dla całego koszyka, gdy strona jest wyświetlana.

Wycena opłat celnych i podatków może być umieszczona na każdej stronie produktu lub na głównej stronie produktu, w zależności od tego, jak jest skonfigurowana Twoja platforma.

Aby dodać wycenę opłat celnych i podatków, zastosuj skrypt, który wygląda jak poniżej. Dwa wymagane pola to name i price.

Przykład: Poniżej znajduje się przykład, jak skrypt będzie wyglądał i działał na Twojej stronie.

Hello integracyjny skrypt

1
2
3
4
5
6
7
8
9
10
11
12
13
zonos.quote({
  items: [
    {
      name: 'The name of the product',
      price: 19.95,
      quantity: 2,
      image: 'https://example.com/product-123.png',
      url: 'https://example.com/product-123',
      sku: '123',
    },
  ],
  currencyCode: 'USD',
});

Skrypty, które mogą być używane, będą musiały zostać dostosowane, aby działały na Twojej stronie. Upewnij się, że którykolwiek z poniższych skryptów, które używasz, jest umieszczony po początkowym Zonos Hello skrypcie.

Jeśli nie używasz platformy, możesz użyć poniższego skryptu, aby dynamicznie pobrać szczegóły swojego produktu. Ten skrypt pobierze pierwszy dostępny produkt. Możesz również dostosować ten skrypt do użycia na stronie koszyka Twojej witryny. Będziesz musiał przejść przez wszystkie produkty i ich dane, a następnie wysłać to do zonos.quote.

Hello skrypt integracyjny

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<script>
  var zPrice = '';
  var zName = '';
  var zImg = '';

  try {
    if (document.querySelector('ID OR CLASSNAME') != null) {
      zPrice = document.querySelectorAll('ID OR CLASSNAME').innerText;
    }

    if (document.querySelector('ID OR CLASSNAME') != null) {
      zName = document.querySelector('ID OR CLASSNAME').innerText;
    }

    if (document.querySelector('.ID OR CLASSNAME') != null) {
      zImg = document.querySelector('ID OR CLASSNAME').src;
    }

    zonos.quote({
      items: [
        {
          name: zName,
          price: zPrice,
          image: zImg,
        },
      ],
      currencyCode: 'USD',
    });
  } catch (error) {}
</script>

Możesz dodać dodatkowe wartości z pól przedmiotów poniżej i również zmienić currencyCode na swoją domyślną walutę.

Shopify i BigCommerce

Jeśli używasz Shopify lub BigCommerce, użyj poniższego kodu.

Shopify
BigCommerce

Jeśli używasz Shopify jako swojej platformy, mamy skrypt, którego możesz użyć, aby pobrać dane produktu z szczegółów produktu Shopify.

Poniższy kod zawiera funkcję, która będzie działać na stronach produktów i stronie koszyka.

Hello integration script

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<script>
    function znDutyTaxEstimateOnDetailPage() {
        {% if product and product.price %}
          zonos.quote({
            items: [{ price: "{{ product.price | money_without_currency }}", name: "{{product.title | replace: '"', '\"'}}", url: "{{ shop.secure_url }}{{ product.url }}", image: "https:{{ product.featured_image | product_img_url: 'medium' }}"}],
            currencyCode: '{{ shop.currency }}'

          });

      {% endif %}

  }

  function znDutyTaxEstimateOnCartPage() {
  if (window.location.href.indexOf("cart") > -1) {
  zonos.quote({
  items: [
  {% for item in cart.items %}
  { price: "{{ item.price | money_without_currency }}", quantity: {{item.quantity}}, name: "{{ item.title | replace: '"', '\"'}}", url: "{{ shop.secure_url }}{{item.url}}", image: "https:{{item.image| product_img_url: 'medium'}}"},
  {% endfor %}
  ],currencyCode: '{{ shop.currency }}'});
  }
  }

  znDutyTaxEstimateOnDetailPage();
  znDutyTaxEstimateOnCartPage();
</script>

Pola cytatów 

PoleTyp danychOpis
itemsarray

WYMAGANE

Lista przedmiotów do uwzględnienia w ofercie
currencyCodestringCeny przedmiotów będą wyświetlane w walucie określonej przez trzyznakowy kod waluty. Domyślnie: USD
includedTaxRatenumberStawka podatku rate jeśli przedmiot zawiera podatek
showDecimalboolWłącza lub wyłącza wyświetlanie wartości dziesiętnej w przeliczonej walucie

Pola przedmiotu 

PoleTyp danychOpis
namestring

WYMAGANE

Nazwa produktu
pricenumber

WYMAGANE

Cena jednostkowa pojedynczego produktu
quantityintegerLiczba produktów w koszyku. Domyślnie: 1
imagestringURL obrazu produktu
urlstringURL do pojedynczego produktu
hsCodestringZharmonizowany kod (kod HS) dla Twojego produktu
categorystringKategoria produktu na Twojej stronie
countrystringDwuznakowy kod ISO kraju, z którego pochodzi ten produkt
customizationstringPersonalizacja produktu (np. rozmiar, kolor)
descriptionstringSzczegółowy opis produktu
skustringUPC lub SKU produktu

Im więcej szczegółów podasz Zonos o swoim produkcie, tym dokładność wyceny zazwyczaj będzie lepsza.

Dostosuj Hello 

Zmień lokalizację flagi

UMIEJĘTNOŚCI POTRZEBNE: Podstawowe umiejętności programistyczne

Domyślnie flaga Zonos Hello pojawi się w prawym dolnym rogu Twojej strony.

Tutaj znajdziesz informacje na temat zmiany lokalizacji flagi oraz ukrywania niektórych elementów Twojej strony internetowej, których nie chcesz, aby międzynarodowi klienci widzieli.

Przykład: Ukrywanie darmowej wysyłki przed międzynarodowymi klientami; to również pozwoli Ci ukryć Zonos Hello przed krajowymi klientami i z określonych krajów.

Jeśli lokalizacja zostanie pozostawiona pusta, kod użyje domyślnej lokalizacji.

Hello skrypt integracyjny

1
2
zonos.config({ location: 'right bottom attached' });
zonos.config({ location: '' });

Dla dolnego lewego rogu:

zonos.config({location: 'left'});

Dla górnego lewego rogu z pływającym oknem informacyjnym:

zonos.config({location: 'left top floating'});

  • floating odnosi się do Hello okna informacyjnego, które unosi się w centrum strony.
  • attached odnosi się do Hello okna informacyjnego, które otwiera się nad flagą.
  • floating jest preferowane przy pozycjonowaniu flagi na top.

Ukryj konkretne treści

UMIEJĘTNOŚCI POTRZEBNE: Podstawowe umiejętności programistyczne

Klasa z-intl opiera się na aktualnym kraju domowym. Jeśli Hello jest ustawione na kraj międzynarodowy, klasa z-intl będzie działać jako klasa ukryta, ukrywając treści, do których jest przypisana .z-intl.

Użyj poniższego CSS, aby ukryć treści. Zastąp .your-content treścią pływającą, którą chcesz ukryć.
.z-intl .your-content { display: none; }

Teraz możesz ukryć Hello przed swoimi krajowymi klientami, aby inne okna były znowu widoczne.

Hello skrypt integracyjny

1
2
3
4
5
6
#zonos {
  display: none;
}
.z-intl #zonos {
  display: block;
}

Ukryj dla konkretnych krajów

Dodaj identyfikator #zonos połączony z kodem kraju, który pełni również rolę klasy CSS dla danego kraju, do funkcji .z-intl { display: none; }.

Linia powinna wyglądać mniej więcej tak:

Hello integracyjny skrypt

1
2
3
.z-intl #zonos.US {
  display: none;
}

Włącz/wyłącz splash

UMIEJĘTNOŚCI POTRZEBNE : Podstawowe umiejętności programistyczne

Splash odnosi się do wyskakującego okna i powiększenia okna dialogowego Zonos, które zawiera dodatkowe informacje dotyczące specyficznej polityki celnej i podatkowej w ich kraju.\

Jeśli chcesz WŁĄCZYĆ i wyświetlić splash Zonos Hello podczas pierwszej wizyty Twoich klientów:

Hello integration script

1
zonos.config({ showSplash: true });

Jeśli chcesz WYŁĄCZYĆ splash Zonos Hello dla pierwszej wizyty swoich klientów:

Hello skrypt integracyjny

1
zonos.config({ showSplash: false });

Uwaga: Wszelkie Zonos dostosowania muszą być umieszczone wewnątrz tagu script.

Najczęściej zadawane pytania 

Nie jestem deweloperem i potrzebuję pomocy. Jakie mam opcje?

Jeśli masz pytania, skontaktuj się z naszym zespołem wsparcia. Jeśli nie masz zasobów, aby zakończyć integrację i potrzebujesz pomocy, skontaktuj się z naszym zespołem usług profesjonalnych.

Czy ta strona była pomocna?