🚨 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:2. JavaScript Files:#
All JavaScript files that directly access the window.customer
 object.
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>
.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"
.When the customer is a guest, elements with zid-visible-customer="true"
will be hiddenTo 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 }}"
.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
.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);
}
});
Modified at 2024-12-16 10:49:55