How to change the position of the Customize button [Shopify]

Zakeke automatically adds the "Customize" button to the product page of customizable products to enable your customers to initialize the customizer.

To change the position of the button, you need to edit the liquid section product-template file by adding this code as shown in the image:

{% unless product.content contains 'zakeke-design-tag' %}
{% if product.tags contains 'zakeke-product' or product.content contains 'zakeke-product-tag' %}
<button id="zakeke-product-button" class="btn product-form__cart-submit">
<input name="zakeke-product-id" type="hidden" value="{{ }}">
<script> (function () { function findAncestor (el, sel) { while ((el = el.parentElement) && !((el.matches || el.matchesSelector).call(el,sel))); return el; } var btn = document.querySelector('#zakeke-product-button'); btn.addEventListener('click', function (event) { event.preventDefault(); event.stopPropagation(); var form = findAncestor(btn, 'form'); if (!form || !form.reportValidity()) { return; } var pid = form.querySelector('input[name="zakeke-product-id"]').value; var originalAction = form.action; form.action = (window.zakekeUrl || '/apps/zakeke') + '?pid=' + pid; window.onpageshow = function(event) { if (event.persisted) { form.action = originalAction; } }; form.submit(); }); })(); </script>
{% endif %}
{% endunless %}


If you need help or you want us to do it on your behalf, please send a message to


Was this article helpful?
0 out of 1 found this helpful