In most cases, the variant id of a product is reflected in the URL when the variants of the product are changed.
However, there are some shops with themes where changing the variants does not affect the URL at all. The problem with these themes is that our app needs the variant id to recognize which variants are sold out in order to display the button on them, and if it can't do that then the button won't be displayed.
Although we have tried several methods to make the app compatible with these themes and in most cases it is, there may still be some themes that require more attention.
We have added the ability to add our HTML input and update the variants for these themes. Here's how you can do it:
The first step is to add the following code to your product page:
var _RestockConfig = window._RestockConfig || {}; _RestockConfig['developer_mode_variant_listener'] = true;
This way our application creates a hidden input HTML element:
<input type="hidden" id="restock-variant-change" />
And then, you need to update the value of the input with each variant change with the selected variant id:
function yourVariantChangeMethod(variant) {
...
const restockInput = document.getElementById('restock-variant-change'); restockInput.value = variant.id;
...
}And that's it.
Let us know if you need any help with this. our support team is always ready to help!