DOCS

Install

/
Hello•
StartseiteGlobaler E-Commerce Integration Installieren

Installieren Sie das Legacy-Produkt Hello

Erfahren Sie, wie Sie Hello auf der Website Ihres Shops installieren.

Wenn Sie Shopify, BigCommerce, Magento, Miva oder X-Cart verwenden, lesen Sie bitte die entsprechende Plugin-Integrationsseite.

Das folgende Skript fügt die Zonos Hello-Flagge zu Ihrer Website hinzu, erkennt das Land, aus dem Ihre Kunden kommen, begrüßt sie und gibt allgemeine Zoll- und Steuerinformationen für ihr Land (grundlegend) an.

Zusätzliche Funktionen sind mit minimalem Entwicklungsaufwand verfügbar (unten aufgeführt).

Fügen Sie Hello zu Ihrer Website hinzu 

1

Fügen Sie das Hello-Skript hinzu - grundlegend

Durch das Hinzufügen dieses Skripts zum Code Ihrer Website wird die Zonos Hello-Flagge auf Ihrer Website hinzugefügt, das Land, aus dem Ihre Kunden kommen, erkannt, sie begrüßt und allgemeine Zoll- und Steuerinformationen für ihr Land bereitgestellt.

ERFORDERLICHE FÄHIGKEITEN: Grundlegende Webfähigkeiten

Um Hello zu installieren, fügen Sie das benutzerdefinierte Skript mit Ihrem eindeutigen Website-Schlüssel vor dem schließenden body-Tag auf Ihrer Website ein.

Hello Integrations-Skript

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

Zonos Hello muss geladen werden, bevor zusätzliche Funktionen hinzugefügt werden. Bitte fügen Sie nach dem obigen Skript alle zusätzlichen Features hinzu.

Sie haben noch kein Skript? ?Klicken Sie hier, um es herunterzuladen.

2

Schätzung von Zöllen und Steuern generieren

BENÖTIGTE FÄHIGKEITEN: Grundlegende Entwicklerfähigkeiten

Wenn dieses Feature aktiviert ist, kann Hello Zoll- und Steuerschätzungen bereitstellen, wenn ein Produkt angesehen oder zum Warenkorb hinzugefügt wird. Hello kann auch vollständige Zoll- und Steuerangebote für den gesamten Warenkorb anzeigen, wenn die Seite angesehen wird.

Das Zoll- und Steuerangebot kann auf jeder Produktseite oder Ihrer Hauptproduktseite angezeigt werden, abhängig davon, wie Ihre Plattform eingerichtet ist.

Um das Zoll- und Steuerangebot hinzuzufügen, wenden Sie ein Skript an, das wie das unten gezeigte aussieht. Die beiden erforderlichen Felder sind name und price.

Beispiel: Unten finden Sie ein Beispiel, wie das Skript auf Ihrer Seite aussehen und funktionieren wird.

Hello Integrations-Skript

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',
});

Skripte, die verwendet werden können, müssen angepasst werden, um auf Ihrer Website zu funktionieren. Stellen Sie sicher, dass alle der folgenden Skripte nach dem initialen Zonos Hello Skript platziert werden.

Wenn Sie keine Plattform verwenden, können Sie das folgende Skript verwenden, um dynamisch Ihre Produktdetails abzurufen. Dieses Skript wird das erste verfügbare Produkt abrufen. Sie können dieses Skript auch anpassen, um es auf der Warenkorbseite Ihrer Website zu verwenden. Sie müssen alle Produkte und deren Daten durchlaufen und diese an das zonos.quote senden.

Hello Integrationsskript

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>

Sie können unten zusätzliche Werte aus den Artikel-Feldern hinzufügen und auch den currencyCode auf Ihre Standardwährung ändern.

Shopify und BigCommerce

Wenn Sie Shopify oder BigCommerce verwenden, verwenden Sie den folgenden Code.

Shopify
BigCommerce

Wenn Sie Shopify als Ihre Plattform verwenden, haben wir ein Skript, das Sie verwenden können, um die Produktdaten aus den Produktdetails Ihres Shopify-Shops abzurufen.

Der folgende Code enthält eine Funktion, die auf den Produktseiten und der Warenkorbseite ausgeführt wird.

Hello Integrations-Skript

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>

Angebotsfelder 

FeldDatentypBeschreibung
itemsarray

ERFORDERLICH

Eine Liste von Artikeln, die im Angebot enthalten sind
currencyCodestringDie Artikelpreise werden in der Währung angezeigt, die durch den dreistelligen Währungscode angegeben ist. Standard: USD
includedTaxRatenumberDer Artikelsteuersatz rate , wenn der Artikel steuerpflichtig ist
showDecimalboolSchaltet die Anzeige des Dezimalwerts bei umgerechneten Währungen ein oder aus

Artikel-Felder 

FeldDatentypBeschreibung
namestring

ERFORDERLICH

Der Produktname
pricenumber

ERFORDERLICH

Einzelpreis eines einzelnen Produkts
quantityintegerDie Anzahl der Produkte im Warenkorb. Standard: 1
imagestringURL des Produktbildes
urlstringURL zum einzelnen Produkt
hsCodestringDer Harmonized Code (HS-Code) für Ihr Produkt
categorystringDie Kategorie des Produkts auf Ihrer Website
countrystringZwei-Buchstaben-ISO-Code des Landes, aus dem dieses Produkt stammt
customizationstringProduktanpassung (z.B. Größe, Farbe)
descriptionstringDie detaillierte Beschreibung des Produkts
skustringDer UPC oder SKU des Produkts

Wenn Sie Zonos mehr Details zu Ihrem Produkt bereitstellen, wird die Genauigkeit der Schätzung in der Regel verbessert.

Passen Sie Hello an 

Ändern Sie den Standort der Flagge

BENÖTIGTE FÄHIGKEITEN: Grundlegende Entwicklerfähigkeiten

Standardmäßig wird die Flagge von Zonos Hello in der unteren rechten Ecke Ihrer Seite angezeigt.

Hier finden Sie einige Informationen, wie Sie den Standort der Flagge ändern und bestimmte Elemente Ihrer Website ausblenden können, die Sie internationalen Nutzern nicht zeigen möchten.

Beispiel: Ausblenden von kostenlosem Versand für internationale Kunden; dies ermöglicht Ihnen auch, Zonos Hello für inländische Kunden und bestimmte Länder auszublenden.

Wenn der Standort leer gelassen wird, verwendet der Code den Standard.

Hello Integrationsskript

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

Für die untere linke Ecke:

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

Für die obere linke Ecke mit einem schwebenden Informationsdialog:

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

  • floating bezieht sich auf den Hello Informationsdialog, der in der Mitte der Seite schwebt.
  • attached bezieht sich auf den Hello Informationsdialog, der über der Flagge geöffnet wird.
  • floating wird bevorzugt, wenn die Flagge oben positioniert ist.

Bestimmte Inhalte ausblenden

BENÖTIGTE FÄHIGKEITEN: Grundlegende Entwicklerfähigkeiten

Die Klasse z-intl basiert auf dem aktuellen Inlandsland. Wenn Hello auf ein internationales Land eingestellt ist, wird die Klasse z-intl als versteckte Klasse fungieren und den Inhalt ausblenden, an den .z-intl gebunden ist.

Verwenden Sie das folgende CSS, um Inhalte auszublenden. Ersetzen Sie .your-content durch den schwebenden Inhalt, den Sie ausblenden möchten.
.z-intl .your-content { display: none; }

Jetzt können Sie Hello von Ihren inländischen Kunden ausblenden, damit andere Dialoge wieder sichtbar sind.

Hello Integrationsskript

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

Ausblenden für bestimmte Länder

Fügen Sie die #zonos ID zusammen mit dem Ländercode, der gleichzeitig als CSS-Klasse für dieses Land dient, der .z-intl { display: none; } Funktion hinzu.

Die Zeile sollte ungefähr so aussehen:

Hello Integrations-Skript

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

Splash ein-/ausschalten

BENÖTIGTE FÄHIGKEITEN : Grundlegende Entwicklerfähigkeiten

Splash bezieht sich auf das Pop-up und die Vergrößerung des Zonos Dialogfelds, das zusätzliche Informationen zu den spezifischen Zoll- und Steuerbestimmungen ihres Landes enthält.\

Wenn Sie den Zonos Hello Splash für den ersten Besuch Ihrer Kunden aktivieren und anzeigen möchten:

Hello Integrationsskript

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

Wenn Sie das Zonos Hello-Splash für den ersten Besuch Ihrer Kunden deaktivieren möchten:

Hello Integrations-Skript

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

Hinweis: Alle benutzerdefinierten Zonos Anpassungen müssen innerhalb eines script-Tags erfolgen.

Häufig gestellte Fragen 

Ich bin kein Entwickler und benötige Unterstützung. Welche Möglichkeiten habe ich?

Wenn Sie Fragen haben, wenden Sie sich bitte an unser Support-Team. Wenn Sie nicht über die Ressourcen verfügen, um die Integration abzuschließen und Unterstützung benötigen, kontaktieren Sie bitte unser Professional Services-Team.

War diese Seite hilfreich?

© 2024 Zonoszonos.com
Auf dieser Seite:
  • Installieren Sie das Legacy-Produkt Hello
  • Fügen Sie Hello zu Ihrer Website hinzu
  • Angebotsfelder
  • Artikel-Felder
  • Passen Sie Hello an
  • Häufig gestellte Fragen