DOCS

Install

/
Hello•
HomeWereldwijde e-commerce Integratie Installeer

Installeer Hello legacy

Leer hoe u Hello op de website van uw winkel installeert.

Als u Shopify, BigCommerce, Magento, Miva of X-Cart gebruikt, lees dan de bijbehorende plugin-integratiepagina.

Het onderstaande script voegt de Zonos Hello vlag toe aan uw site, herkent het land waar uw klanten vandaan komen, begroet hen en geeft algemene informatie over douane en belastingen voor hun land (basis).

Aanvullende functies zijn beschikbaar met minimale ontwikkelingswerkzaamheden (hieronder weergegeven).

Voeg Hello toe aan uw site 

1

Voeg het Hello script toe - basis

Door dit script aan de code van uw site toe te voegen, voegt u de Zonos Hello vlag toe aan uw website, herkent u het land waar uw klanten vandaan komen, begroet u hen en geeft u algemene informatie over douane en belastingen voor hun land.

VAARDIGHEDEN NODIG: Basis webvaardigheden

Om Hello te installeren, past u het aangepaste script met uw unieke site-sleutel toe op uw website vóór de sluitende body tag.

Hello integratiescript

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

Zonos Hello moet worden geladen voordat er extra functionaliteit wordt toegevoegd. Gelieve eventuele extra functies na het bovenstaande script op te nemen.

Heb je nog geen script? ? Klik hier om te downloaden.

2

Genereer geschatte douane- en belastingkosten

VEREISTE VAARDIGHEDEN : Basis ontwikkelaarsvaardigheden

Wanneer deze functie is ingeschakeld, kan Hello schattingen van douane- en belastingkosten geven wanneer een product wordt bekeken of aan de winkelwagentoegevoegd. Hello kan ook volledige douane- en belastingoffertes voor de hele winkelwagentoonen wanneer de pagina wordt bekeken.

De douane- en belastingofferte kan op elke productpagina of je hoofdpagina voor producten worden weergegeven, afhankelijk van hoe je platform is ingesteld.

Om de douane- en belastingofferte toe te voegen, pas je een script toe dat eruitziet als het onderstaande voorbeeld. De twee vereiste velden zijn name en price.

Voorbeeld: Hieronder staat een voorbeeld van hoe het script eruit zal zien en functioneren op je pagina.

Hello integratiescript

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

Scripts die kunnen worden gebruikt, moeten worden aangepast om ze voor uw site te laten werken. Zorg ervoor dat een van de volgende scripts die u gebruikt, na het initiële Zonos Hello Script wordt geplaatst.

Als u geen platform gebruikt, kunt u het volgende gebruiken om dynamisch uw productdetails te verkrijgen. Dit script zal het eerste beschikbare product ophalen. U kunt dit script ook aanpassen om het op de winkelwagentpagina van uw site te gebruiken. U moet door alle producten en hun gegevens lopen en deze vervolgens naar de zonos.quote verzenden.

Hello integratiescript

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>

U kunt aanvullende waarden uit de itemvelden hieronder toevoegen en ook de currencyCode wijzigen naar uw standaardvaluta.

Shopify en BigCommerce

Als u Shopify of BigCommerce gebruikt, gebruik dan de onderstaande code.

Shopify
BigCommerce

Als u Shopify als uw platform gebruikt, hebben we een script dat u kunt gebruiken om de productgegevens van uw Shopify-productdetails op te halen.

De onderstaande code bevat een functie die op de productpagina's en de winkelwagentjespagina zal draaien.

Hello integratiescript

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>

Offertevelden 

VeldGegevenstypeBeschrijving
itemsarray

VERPLICHT

Een lijst van items die in de offerte moeten worden opgenomen
currencyCodestringDe prijzen van de items worden weergegeven in de valuta die is opgegeven door de drieletterige valutacode. Standaard: USD
includedTaxRatenumberHet belasting rate van het item als het item belasting bevat
showDecimalboolZet aan of uit het tonen van de decimale waarde op geconverteerde valuta

Itemvelden 

VeldGegevenstypeBeschrijving
namestring

VERPLICHT

De productnaam
pricenumber

VERPLICHT

Eenheidsprijs van een enkel product
quantityintegerHet aantal producten in de winkelwagentje. Standaard: 1
imagestringURL van de productafbeelding
urlstringURL naar het individuele product
hsCodestringDe Geharmoniseerde Code (HS-code) voor uw product
categorystringDe categorie van het product op uw site
countrystringTweeletterige ISO-code van het land waar dit product vandaan komt
customizationstringProductaanpassing (bijv. maat, kleur)
descriptionstringDe gedetailleerde beschrijving van het product
skustringDe UPC of SKU van het product

Naarmate u meer details aan Zonos over uw product verstrekt, zal de nauwkeurigheid van de schatting meestal verbeteren.

Pas Hello aan 

Verander de vlaglocatie

VAARDIGHEDEN NODIG: Basis ontwikkelaarsvaardigheden

Standaard verschijnt de Zonos Hello vlag in de rechterbenedenhoek van uw pagina.

Hier vindt u informatie over hoe u de locatie van de vlag kunt wijzigen en bepaalde elementen van uw website kunt verbergen die u niet wilt dat internationale klanten zien.

Voorbeeld: Gratis verzending verbergen voor internationale klanten; dit stelt u ook in staat om Zonos Hello te verbergen voor binnenlandse klanten en specifieke landen.

Als de locatie leeg wordt gelaten, zal de code de standaard gebruiken.

Hello integratiescript

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

Voor de linkerbenedenhoek:

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

Voor de linkerbovenhoek met een zwevende informatie dialoog:

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

  • floating verwijst naar de Hello informatie dialoog die in het midden van de pagina zweeft.
  • attached verwijst naar de Hello informatie dialoog die boven de vlag opent.
  • floating heeft de voorkeur bij het positioneren van de vlag aan de bovenkant.

Specifieke inhoud verbergen

VEREISTE VAARDIGHEDEN: Basis ontwikkelaarsvaardigheden

De z-intl klasse is gebaseerd op het huidige binnenlandse land. Als Hello is ingesteld op een internationaal land, zal de z-intl klasse fungeren als een verborgen klasse, waardoor de inhoud die aan .z-intl is gekoppeld, verborgen wordt.

Gebruik de volgende CSS om inhoud te verbergen. Vervang .your-content met de zwevende inhoud die je wilt verbergen.
.z-intl .your-content { display: none; }

Nu kun je Hello verbergen voor je binnenlandse klanten, zodat andere dialoogvensters weer zichtbaar zijn.

Hello integratiescript

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

Verbergen voor specifieke landen

Voeg de #zonos id samen met de landcode die ook als de CSS-klasse voor dat land fungeert toe aan de .z-intl { display: none; } functie.

De regel zou er ongeveer zo uit moeten zien:

Hello integratiescript

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

Zet de splash aan/uit

VEREISTE VAARDIGHEDEN : Basis ontwikkelaarsvaardigheden

Splash verwijst naar de pop-up en vergroting van het Zonos dialoogvenster, dat aanvullende informatie bevat over het specifieke douane- en belastingbeleid van hun land.\

Als u de Zonos Hello splash voor de eerste bezoek van uw klanten WIL INSCHAKELEN en weergeven:

Hello integratiescript

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

Als u de Zonos Hello splash voor de eerste bezoek van uw klanten wilt UITZETTEN:

Hello integratiescript

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

Opmerking: Alle Zonos aanpassingen moeten binnen een script tag staan.

Veelgestelde vragen 

Ik ben geen ontwikkelaar en heb hulp nodig. Wat zijn mijn opties?

Als u vragen heeft, neem dan contact op met ons ondersteuningsteam. Als u niet de middelen heeft om de integratie te voltooien en hulp nodig heeft, neem dan contact op met ons Professional Services team.

Was deze pagina nuttig?

© 2024 Zonoszonos.com
Op deze pagina:
  • Installeer Hello legacy
  • Voeg Hello toe aan uw site
  • Offertevelden
  • Itemvelden
  • Pas Hello aan
  • Veelgestelde vragen