🚨 Important Update: Zid Themes

As part of our efforts to improve browsing speed and performance, customer-related information will no longer be rendered directly from the server. This document outlines new alternative methods to retrieve customer data.

Key Changes

The customer object will no longer be available.

The global object window.customer will also no longer be available.

The following examples will not work:

{{ customer.name }}  // no longer works
{{ customer.email }} // no longer works
{{ customer.wishlist }} // no longer works
{{ session.customerToken }} // no longer works

{% if customer %} // no longer works
<div>HTML content</div>
{% endif %}

<script>
	window.customer // no longer works
</script>

Affected Files

1. Twig Files:

This change impacts all theme Twig files, including their associated include files, except for account-related files. The excluded files are:

account-profile.twig

account-addresses.twig

account-orders.twig

account-wishlist.twig

2. JavaScript Files:

All JavaScript files that directly access the window.customer object.

Alternative Methods to Retrieve Customer Information

1. Using Zid Tags:

For customer details such as name, email, and mobile number, use the new <zid-store-customer> tag.

Replace {{ customer.name }} with <zid-store-customer get="name"></zid-store-customer>.

Example:

The <zid-store-customer> tag dynamically retrieves and replaces customer details.

To conditionally display content based on whether the customer is logged in, replace {% if customer %} with zid-visible-customer="true" or zid-visible-guest="true".

Example 1:

Example 2:

When the customer is a guest, elements with zid-visible-customer="true" will be hidden

To show or hide elements based on whether a product is in the customer’s wishlist, use zid-visible-wishlist="{{ product.id }}" or zid-hidden-wishlist="{{ product.id }}".

Example:

2. Using JavaScript Event Listener:

You can listen for the zid-customer-fetched event to retrieve customer data. If the user is a guest, the customer object will be null.

Example:

document.addEventListener('zid-customer-fetched', function(event) {
    var customer = event.detail.customer; // null if the user is a guest
    if (customer) {
        $('.send-notify-name').val(customer.name);
        $('.send-notify-email').val(customer.email);
    }
});

🚨 Important Update: Zid Themes

Key Changes#

Affected Files#

1. Twig Files:#

2. JavaScript Files:#

Alternative Methods to Retrieve Customer Information#

1. Using Zid Tags:#

2. Using JavaScript Event Listener:#

Key Changes

Affected Files

1. Twig Files:

2. JavaScript Files:

Alternative Methods to Retrieve Customer Information

1. Using Zid Tags:

2. Using JavaScript Event Listener: