This is advance section for developer in case they want to custom quick view app deeper.
For example we have this case : “ I don’t like Quick View’s Sold out button , how can I hide that button when my product is out of stock ”
Quick view have a template file with name : “sca-quick-view-template.liquid” . This file is “template” only , you can’t call “product” liquid variable in this file. All content of Quick View popup was fill in this “template” by javascript. So if you want to interact with popup content you have to use javascript.
Quick View have a special callback function with name : sca_default_callback_function ($, product) this javascript function will be call after popup showed to customer.
So all you need to do is override this function . in this example we will override this function so that it will check a product is available or not, if not it will hide “Sold out” button.
<script>
function sca_default_callback_function ($,product) {
//check if product is available or not
if (product.available) {
$('#sca-qv-sold-out').hide();
}
}
</script>
You should put above code at end of theme.liquid file or sca-quick-view-template.liquid.
*Note: you should be carefully when override this function because maybe this function was override by other developer.
Comments