Customizing the Quick View templates
WooCommerce Quick View Pro uses a similar template mechanism to WooCommerce.
All template files used in the plugin can be overridden by placing them in a /woocommerce/quick-view-pro/
folder inside your theme folder. You may need to create one or both of these directories.
The main template for displaying the contents of the Quick View is called quick-view.php
. To override this template in your theme:
- Copy the existing template file contained in the plugin folder (
/wp-content/plugins/woocommerce-quick-view-pro/templates/quick-view.php
) - Place the file in your theme or child theme at this location:
/wp-content/themes/my-theme/woocommerce/quick-view-pro/quick-view.php
Then make any changes required to the template.
List of templates used in the plugin
The following templates are used by the plugin. Each can be overridden by placing a file of the same name inside your theme in the /woocommerce/quick-view-pro/
folder:
- quick-view.php
- product-image.php
- product-thumbnails.php
- product-hidden-content.php
Modifying the Quick View contents via actions or filters
If you inspect the quick-view.php
template you'll notice various hooks that you can use to modify the output displayed inside the quick view. For example, the wc_quick_view_pro_after_quick_view_product
hook fires after the main product <div> but still inside the quick view. The full list of actions in the template are:
wc_quick_view_pro_before_quick_view
- before the quick view modal itselfwc_quick_view_pro_before_quick_view_product
- before the product wrapper.wc_quick_view_pro_quick_view_before_product_details
- before the product details. The image gallery is hooked here.wc_quick_view_pro_quick_view_product_details
- outputs the product details: name, excerpt, price, etc, depending on plugin settings.wc_quick_view_pro_quick_view_after_product_details
- after the product details, if displayed. Available from version 1.2.wc_quick_view_pro_aftere_quick_view_product
-after the product wrapperwc_quick_view_pro_quick_view_content_hidden
- displays content when a product is "hidden". You can override theproduct-hidden-content.php
template to change the hidden content.wc_quick_view_pro_after_quick_view
- after the quick view modal