Haravan

Hướng dẫn cài đặt giải pháp Criteo trên Haravan

Overview

Bài viết sau sẽ hưỡng dẫn chi tiết cách cài đặt Criteo trên Haravan

[[disclaimer-nonplugin]]

Feed

Tạo API key

  • Tạo ứng dụng riêng, vào đường link https://<tên gian hàng>.myharavan.com/admin/app#/private/new

  • Điền tiêu đề "criteoapi" và chọn Lưu 1

  • Click chọn tên ứng dụng trong bảng 2

  • Copy và gửi kỹ thuật viên bên Criteo thông tin chứng thực 3

Tags

Homepage, Listing, Product and Basket Tag

  • Vào đường link https://<tên gian hàng>.myharavan.com/admin/theme#/list và chọn Hiệu chỉnh theme 4

  • Tạo một snippet mới gọi là criteo-tracking 5

  • Copy nội dung code sau vào snippet

<!-- CRITEO -->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
    var site_type = (window.innerWidth <= 767) ? 'm' : (window.innerWidth >= 980) ? 'd' : 't';

    window.criteo_q = window.criteo_q || [];
    window.criteo_q.push(
        { event: "setAccount", account: {{accountid}} },
        { event: "setSiteType", type: site_type},
        { event: "setEmail", email: "{{customer.email | remove: " " | strip_newlines | downcase | md5}}"});
</script>
{% case template %}
    {% when 'index' %}
        <script type="text/javascript">
            window.criteo_q.push(
                { event: "viewHome", ecpplugin: "haravan"}
            );
        </script>
    {% when 'collection' %}
        <script>
            var criteo_items = [];
            {% for item in collection.products limit:3 %}
                criteo_items.push("{{item.id}}");
            {% endfor %}
                window.criteo_q.push(
                    { event: "viewList", ecpplugin: "haravan", product: criteo_items}
                );
        </script>
    {% when 'product' %}
        <script type="text/javascript">
            window.criteo_q.push(
                { event: "viewItem", ecpplugin: "haravan", product: "{{ product.id }}" }
            );
        </script>
    {% when 'cart' %}
        <script>
            var criteo_items = [];
            {% for item in cart.items %}
                criteo_items.push({
                    id : "{{item.product.id}}",
                    price : {{item.price | money_without_currency | remove: "," | remove: "₫" }},
                    quantity : {{item.quantity}}
                });
            {% endfor %}
            window.criteo_q.push(
                { event: "viewBasket", ecpplugin: "haravan", product: criteo_items}
            );
        </script>
{% endcase %}
<!-- END CRITEO -->
  • Mở layout file theme.liquid và chèn đoạn code sau trước khi đóng tag body
<!----- YOU MUST INCLUDE THIS STATMENT WHEN USING A NEW THEME OR CRITEO TAGS WILL BREAK ---------->
    {% include 'criteo-tracking' %}
<!----- YOU MUST INCLUDE THIS STATMENT WHEN USING A NEW THEME OR CRITEO TAGS WILL BREAK ---------->

6

Sales Confirmation Tag

  • Vào phần Cấu hình thanh toán qua đường link https://<tên gian hàng>.myharavan.com/admin/settings/checkout

  • Kéo chuột xuống mục Xử lý đơn hàng, copy đoạn code sau vào Nội dung thông báo thêm 7

<!-- CRITEO START -->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
var site_type = (window.innerWidth <= 767) ? 'm' : (window.innerWidth >= 980) ? 'd' : 't';
var criteo_items = [];
{% for item in line_items %}
criteo_items.push({id : "{{item.product.id}}",price : {{item.price | money_without_currency | remove: ',' | remove: '₫' }},quantity : {{item.quantity}}});
{% endfor %}
    window.criteo_q = window.criteo_q || [];
    window.criteo_q.push(
        { event: "setAccount", account: {{accountid}} },
        { event: "setSiteType", type: site_type},
        { event: "setEmail", email: "{{customer.email | remove: " " | strip_newlines | downcase | md5}}"},
        { event: "trackTransaction", ecpplugin: "haravan", id: "{{ order_number }}", product: criteo_items});
</script>
<!-- CRITEO END -->