Quick view style<\/h3>\n\n\n\n
From the General settings you can choose between three layout options for the Quick view style<\/strong>: modal window, sliding panel, cascading<\/em>. Depending on the layout you choose, you’ll get additional settings:<\/p>\n\n\n\n This layout will open the quick view in a classic modal window.<\/p>\n\n\n\n Selecting this option you can also choose the animation when the Modal animation <\/em>(slide in, fade in or scale up) when you open and close it and the size of the modal window<\/em> (15).<\/p>\n\n\n\n You can also decide if users can navigate through other products from the modal window (16), and enable a text to display when the modal window is loading (17).<\/p>\n\n\n\n For example, users can easily browse other products’ through the quick view within the same category as the one they are currently viewing.<\/p>\n\n\n\n This option displays the product tab directly on the page within a pop-up section (18).<\/p>\n\n\n If selected, you can also set the behavior when closing the cascading quick view (19), so that it either stays in the same row below<\/em> or it scrolls back to the row of the selected product.<\/em><\/p>\n\n\n\n This option displays the quick view in a side panel that slides in from the right side of the browser window (20). <\/p>\n\n\n\n From the Content options<\/em> you can configure how to display the product images. You have three options for the thumbnails type<\/em> selection: either don’t show, slider mode or classic mode.<\/p>\n\n\n\n If you select Slider mode<\/em>, you can choose if the arrows display permanently or only when hovering over the image (21).<\/p>\n\n\n\n If you select Classic mode<\/em> (22), you can enable image zoom (only if you have YITH Zoom Magnifier installed, you can click here<\/a> to read more about the integration).<\/p>\n\n\n\n From the General settings<\/strong>, you can configure the Quick view button in the WooCommerce loop, choosing either a textual or an icon button. <\/p>\n\n\n\n When selecting Textual<\/em> you can set the button text label and the position of the button (below the “add to cart” button, within the product image or use a shortcode\/block) (23).<\/p>\n\n\n\n If you choose an Icon <\/em>instead, you can upload the file for the icon and set the button position as well (24).<\/p>\n\n\n\n From the Content options<\/strong>, you can enable a “View details” button to allow users to go to the single product page directly from the quick view popup (25).<\/p>\n\n\n\n If enabled, from the Customization<\/strong> tab you can select if the “View details” is a text link or a button. For the button, you can also choose colors (26):<\/p>\n\n\n\n For example, this is how the “View details” button would look like:<\/p>\n\n\n\nModal window<\/strong><\/h5>\n\n\n\n
![\"Modal](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/018.modal-window-style-options.jpg\")
<\/a><\/figure>\n\n\n\n![\"Modal](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/20.quick-view-navigation-example.jpg\")
<\/a><\/figure>\n\n\n\nCascading style<\/strong><\/h5>\n\n\n\n
![\"Cascading](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/21.cascading-style-options.png\")
<\/a><\/figure><\/div>\n\n\n![\"Cascading](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/17.cascading-style-example.jpg\")
<\/a><\/figure>\n\n\n\nSliding panel<\/strong><\/h5>\n\n\n\n
![\"Sliding](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/sliding-panel-style.jpg\")
<\/a><\/figure>\n\n\n\n![\"Sliding](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/sliding-panel-example.jpg\")
<\/a><\/figure>\n\n\n\nProduct image options <\/strong><\/h3>\n\n\n\n
![\"Image](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/022.thumbnails-slider-mode.png\")
<\/a><\/figure>\n\n\n\n![\"Slider](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/26.slider-model-example.png\")
<\/a><\/figure>\n\n\n\n![\"Image](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/023.thumbnails-classic-mode.jpg\")
<\/a><\/figure>\n\n\n\n![\"Classic](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/025.classic-thumbnail-example.jpg\")
<\/a><\/figure>\n\n\n\n“Quick view” button options<\/h3>\n\n\n\n
![\"Textual](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/027.textual-quick-view-button.jpg\")
<\/a><\/figure>\n\n\n![\"Quick](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/32.quick-view-textual-example.jpg\")
<\/a><\/figure><\/div>\n\n\n![\"Icon](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/028.icon-quick-view-button.jpg\"){kind=icon}
<\/a><\/figure>\n\n\n![\"Quick](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/31.quick-view-icon-example.jpg\"){kind=icon}
<\/a><\/figure><\/div>\n\n\n![\"Enable](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/29.view-details-option.jpg\")
<\/a><\/figure>\n\n\n\n![\"View](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/30.view-details-button-type.jpg\")
<\/a><\/figure>\n\n\n\n![\"View](\"https:\/\/docs.yithemes.com\/yith-woocommerce-quick-view\/wp-content\/uploads\/sites\/353\/2024\/11\/33.view-details-button.jpg\")
<\/a><\/figure>\n","protected":false},"excerpt":{"rendered":"