DOCS

Install

/
Hello•
Trang chủThương mại điện tử toàn cầu Tích hợp Cài đặt

Cài đặt Hello legacy

Tìm hiểu cách cài đặt Hello trên trang web của cửa hàng bạn.

Nếu bạn đang sử dụng Shopify, BigCommerce, Magento, Miva, hoặc X-Cart vui lòng đọc trang tích hợp plugin tương ứng.

Script dưới đây sẽ thêm cờ Zonos Hello vào trang của bạn, nhận diện quốc gia mà khách hàng của bạn đang truy cập, chào đón họ và cung cấp thông tin về thuế và phí hải quan chung cho quốc gia của họ (cơ bản).

Các tính năng bổ sung có sẵn với một chút công việc phát triển (được hiển thị bên dưới).

Thêm Hello vào trang của bạn 

1

Thêm script Hello - cơ bản

Thêm script này vào mã của trang web bạn sẽ thêm cờ Zonos Hello vào trang web của bạn, nhận diện quốc gia mà khách hàng của bạn đang truy cập, chào đón họ và cung cấp thông tin về thuế và phí hải quan chung cho quốc gia của họ.

KỸ NĂNG CẦN THIẾT: Kỹ năng web cơ bản

Để cài đặt Hello, hãy áp dụng script tùy chỉnh chứa khóa trang duy nhất của bạn vào trang web của bạn trước thẻ body đóng.

Hello integration script

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

Zonos Hello phải được tải trước khi bất kỳ chức năng bổ sung nào được thêm vào. Vui lòng bao gồm bất kỳ tính năng bổ sung nào sau đoạn mã trên.

Chưa có đoạn mã nào? ?Nhấp vào đây để tải xuống.

2

Tạo ước tính thuế và phí

KỸ NĂNG CẦN CÓ: Kỹ năng phát triển cơ bản

Khi tính năng này được kích hoạt, Hello có thể cung cấp ước tính thuế và phí khi một sản phẩm được xem hoặc thêm vào giỏ hàng. Hello cũng có thể hiển thị đầy đủ ước tính thuế và phí cho toàn bộ giỏ hàng khi trang được xem.

Ước tính thuế và phí có thể được đặt trên mỗi trang sản phẩm hoặc trang sản phẩm chính của bạn, tùy thuộc vào cách nền tảng của bạn được thiết lập.

Để thêm ước tính thuế và phí, hãy áp dụng một đoạn mã trông giống như đoạn mã được hiển thị bên dưới. Hai trường bắt buộc là name và price.

Ví dụ: Dưới đây là một ví dụ về cách đoạn mã sẽ trông như thế nào và hoạt động trên trang của bạn.

Hello integration script

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

Các tập lệnh có thể được sử dụng sẽ cần được điều chỉnh để hoạt động cho trang web của bạn. Vui lòng đảm bảo rằng bất kỳ tập lệnh nào trong số sau mà bạn sử dụng đều được đặt sau tập lệnh ban đầu Zonos Hello.

Nếu bạn không sử dụng nền tảng nào, bạn có thể sử dụng đoạn mã sau để lấy chi tiết sản phẩm của bạn một cách động. Tập lệnh này sẽ lấy sản phẩm đầu tiên có sẵn. Bạn cũng có thể điều chỉnh tập lệnh này để sử dụng trên trang giỏ hàng của trang web của bạn. Bạn sẽ cần lặp qua tất cả các sản phẩm và dữ liệu của chúng, sau đó gửi điều đó đến zonos.quote.

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
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>

Bạn có thể thêm các giá trị bổ sung từ các trường mục bên dưới và cũng thay đổi currencyCode để là đơn vị tiền tệ mặc định của bạn.

Shopify và BigCommerce

Nếu bạn đang sử dụng Shopify hoặc BigCommerce, hãy sử dụng mã dưới đây.

Shopify
BigCommerce

Nếu bạn đang sử dụng Shopify làm nền tảng của mình, chúng tôi có một đoạn mã bạn có thể sử dụng để lấy dữ liệu sản phẩm từ chi tiết sản phẩm Shopify của bạn.

Mã dưới đây có một hàm sẽ chạy trên trang sản phẩm và trang giỏ hàng.

Hello script tích hợp

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>

Các trường báo giá 

TrườngLoại dữ liệuMô tả
itemsarray

BẮT BUỘC

Danh sách các mặt hàng để bao gồm trong báo giá
currencyCodestringGiá của mặt hàng sẽ hiển thị bằng loại tiền tệ được chỉ định bởi mã tiền tệ ba ký tự. Mặc định: USD
includedTaxRatenumberThuế của mặt hàng rate nếu mặt hàng bao gồm thuế
showDecimalboolBật hoặc tắt việc hiển thị giá trị thập phân trên các loại tiền tệ đã chuyển đổi

Các trường mặt hàng 

TrườngLoại dữ liệuMô tả
namestring

BẮT BUỘC

Tên sản phẩm
pricenumber

BẮT BUỘC

Giá đơn vị của một sản phẩm đơn lẻ
quantityintegerSố lượng sản phẩm trong giỏ hàng. Mặc định: 1
imagestringURL của hình ảnh sản phẩm
urlstringURL đến sản phẩm riêng lẻ
hsCodestringMã Hài hòa (HS code) cho sản phẩm của bạn
categorystringDanh mục sản phẩm trên trang của bạn
countrystringMã ISO hai ký tự của quốc gia mà sản phẩm này xuất xứ
customizationstringTùy chỉnh sản phẩm (ví dụ: kích thước, màu sắc)
descriptionstringMô tả chi tiết của sản phẩm
skustringUPC hoặc SKU của sản phẩm

Khi bạn cung cấp thêm thông tin cho Zonos về sản phẩm của mình, độ chính xác của ước tính sẽ thường được cải thiện.

Tùy chỉnh Hello 

Thay đổi vị trí cờ

KỸ NĂNG CẦN CÓ : Kỹ năng phát triển cơ bản

Theo mặc định, cờ của Zonos Hello sẽ xuất hiện ở góc dưới bên phải của trang bạn.

Tại đây, bạn sẽ tìm thấy một số thông tin về cách thay đổi vị trí của cờ cũng như ẩn một số yếu tố trên trang web của bạn mà bạn không muốn người quốc tế thấy.

Ví dụ: Ẩn miễn phí vận chuyển từ người quốc tế; điều này cũng sẽ cho phép bạn ẩn Zonos Hello khỏi khách hàng trong nước và các quốc gia cụ thể.

Nếu vị trí để trống, mã sẽ sử dụng mặc định.

Hello integration script

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

Đối với góc dưới bên trái:

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

Đối với góc trên bên trái với một hộp thoại thông tin nổi:

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

  • floating đề cập đến hộp thoại thông tin Hello nổi ở giữa trang.
  • attached đề cập đến hộp thoại thông tin Hello mở trên cờ.
  • floating được ưu tiên khi định vị cờ ở top.

Ẩn nội dung cụ thể

KỸ NĂNG CẦN CÓ: Kỹ năng phát triển cơ bản

Lớp z-intl dựa trên quốc gia nội địa hiện tại. Nếu Hello được đặt thành một quốc gia quốc tế, lớp z-intl sẽ hoạt động như một lớp ẩn, ẩn nội dung mà .z-intl liên kết với.

Sử dụng CSS sau để ẩn nội dung. Thay thế .your-content bằng nội dung nổi mà bạn muốn ẩn.
.z-intl .your-content { display: none; }

Bây giờ bạn có thể ẩn Hello khỏi khách hàng nội địa của bạn để các hộp thoại khác lại hiển thị.

Hello integration script

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

Ẩn cho các quốc gia cụ thể

Thêm id #zonos kết hợp với mã quốc gia mà cũng là lớp CSS cho quốc gia đó vào hàm .z-intl { display: none; }.

Dòng này sẽ trông giống như sau:

Hello tích hợp script

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

Bật/tắt màn hình chào

KỸ NĂNG CẦN CÓ : Kỹ năng lập trình cơ bản

Màn hình chào đề cập đến việc hiển thị và phóng to hộp thoại Zonos, chứa thông tin bổ sung về chính sách thuế và phí cụ thể của quốc gia họ.\

Nếu bạn muốn BẬT và hiển thị màn hình chào Zonos Hello cho lần truy cập đầu tiên của khách hàng:

Hello integration script

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

Nếu bạn muốn tắt màn hình chào của Zonos Hello cho lần truy cập đầu tiên của khách hàng:

Hello tích hợp script

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

Lưu ý: Bất kỳ tùy chỉnh nào của Zonos sẽ cần phải nằm trong thẻ script.

Các câu hỏi thường gặp 

Tôi không phải là nhà phát triển và cần hỗ trợ. Tôi có những lựa chọn nào?

Nếu bạn có câu hỏi, vui lòng liên hệ với đội ngũ hỗ trợ. Nếu bạn không có nguồn lực để hoàn thành việc tích hợp và cần hỗ trợ, vui lòng liên hệ với đội ngũ Dịch vụ Chuyên nghiệp.

Trang này có hữu ích không?

© 2024 Zonoszonos.com
Trên trang này:
  • Cài đặt Hello legacy
  • Thêm Hello vào trang của bạn
  • Các trường báo giá
  • Các trường mặt hàng
  • Tùy chỉnh Hello
  • Các câu hỏi thường gặp