Addonify Quick View also supports custom quick view button. Below is the markup of the custom quick view button:

<button class="addonify-qvm-button" data-product_id="{product_id}">{button_label}</button>

You can add custom CSS classes, but addonify-qvm-button is a necessary CSS class that is used to fire the quick view popup modal.

You also need to provide ID of WooCommerce product in the attribute data-product_id.

You can have your own button label. But if you wish to have the button label from the Addonify Quick View plugin’s setting page, use the code below:

get_option( 'addonify_qv_quick_view_btn_label' );

Disable on a mobile device

We have added the option to disable quick view on a mobile device since version 1.1.1. If the disable option for a mobile device is checked in the addonify quick view dashboard setting page, addonify-quick-view-disabled class is added to the body.

You can easily hide it with the help of CSS. Below is the example code snippet.

/* Example 1: only devices <= 575px */
@media ( max-width: 575px ) {

    .addonify-quick-view-disabled .your-custom-quick-view-button {

        display: none; /* Hide */
    }
}

/* Example 2: or even globally */
.addonify-quick-view-disabled .your-custom-quick-view-button {

  display: none; /* Hide */
}

Hence, except custom button, none of the addonify quick view public assets gets initialized when disable on mobile is enabled & mobile user agent is detected. We are using this open source library to detect the mobile device.