Gerasimos Tsiamalos

Vassilis Mastorostergios

Anastis Sourgoutsidis

The CSSIgniter Team

CSSIgniter Quick View for WooCommerce is the easiest way to improve your conversion rates on your ecommerce website. Your customers will be able to preview products and add them in their cart through the lightbox.
<h3>Live Demo</h3>
Visit our <a href="https://www.cssigniter.com/preview/quick-view-pro/" rel="nofollow ugc">live demo</a>.
<h3>Documentation</h3>
Documentation is <a href="https://www.cssigniter.com/docs/quick-view-woo-pro/" rel="nofollow ugc">available here</a>.
<h3>Features</h3>
<ol>
<li>In your product listing pages you can add the Quick View button in the following locations:
<ul>
<li>Before Thumbnail</li>
<li>Before Title</li>
<li>Before Rating</li>
<li>Before Price</li>
<li>Before Add to Cart button</li>
<li>After Add to Cart button</li>
</ul>
</li>
<li>Customize the “Quick View” button text.</li>
<li>Add custom CSS classes for easier customization</li>
<li>Toggle visibility of the “Quick View” button in mobile devices.</li>
<li>Toggle visibility of the “Quick View” button in related products, up-sells etc.</li>
<li>Change the width of the lightbox.</li>
<li>Change the colors of the lightbox content (Background, text & link colors, button colors and more!)</li>
</ol>
<h3>Additional features can be found in our <a href="https://www.cssigniter.com/plugins/quick-view-woo-pro/" rel="nofollow ugc">Premium Add-on</a></h3>
<ol>
<li>Include visibility of the “Quick View” button in certain categories only</li>
<li>Exclude visibility of the “Quick View” button from certain categories.</li>
<li>Customize the colors of the “Quick View” button.</li>
<li>Change the width of the image(s) area and the content area within the lightbox.</li>
<li>Toggle visiblity of the following lightbox product elements:
<ol>
<li>Sales badge</li>
<li>Image</li>
<li>Gallery</li>
<li>Title</li>
<li>Rating</li>
<li>Price</li>
<li>Short Description</li>
<li>Add to Cart button</li>
<li>Meta description</li>
</ol>
</li>
</ol>
Learn more about the <a href="https://www.cssigniter.com/plugins/quick-view-woo-pro/" rel="nofollow ugc">PRO Add-on here</a>.

CSSIgniter Quick View for WooCommerce

Quick View Woo adds a flexible Quick View button on your WooCommerce pages!

Addonify

Addonify WooCommerce Quick View plugin adds functionality to have a quick preview of WooCommerce product on a popup modal.
🌍 Official Demo: <a href="https://demo.addonify.com/woo/01/" rel="nofollow ugc">Link 1</a> 
🌍 Official Demo: <a href="https://demo.addonify.com/woo/01/quick-view-ii/" rel="nofollow ugc">Link 2</a> 
📜 Documentation: <a href="https://docs.addonify.com/kb/quick-view/" rel="nofollow ugc">Doc Link</a>
If you run an online e-commerce shop, then you must be familiar with the number of products that your users will see in your store page. This plugin allows your website visitors to quickly view the product summary instead of going through each product’s detail page. This could save the time of your visitors & increase your revenue.
🦄 MAIN FEATURES:
✅ Easy to use. 
✅ Super light-weight & optimized for performance. 
✅ Add a quick view button in product loop to open a modal window with the product summary using AJAX. 
✅ Display product image or gallery on quick view modal. 
✅ Display product title, price, add to cart button, excerpt and view detail button on quick view modal. 
✅ Disable quick view on mobile device. 
✅ Modal box opening & closing animations. 
✅ Modal content row direction layout. 
✅ Change a label for the “Quick view” button. 
✅ Display icon on “Quick view” button. 
✅ Choose spinner icon. 
✅ Customize what you would like to display inside the modal box. 
✅ Display product detail page link in modal. 
✅ Close modal on ESC key pressed. 
✅ Close modal when clicked outside. 
✅ Display/Hide modal close button. 
✅ JavaScript API for developers. 
✅ Developer friendly & easy to implement according to your need. 
✅ Add custom CSS if required from admin setting page. 
✅ Clean setting page design. 
✅ Friendly support.
🌈 DESIGN OPTIONS:
✅ Customize quick view button text color. 
✅ Customize quick view button background color. 
✅ Customize quick view border color. 
✅ Customize quick view button border radius. 
✅ Customize modal box background color. 
✅ Customize modal overlay mask background color. 
✅ Customize modal box border color. 
✅ Customize modal text colors. 
✅ Customize modal box border radius. 
✅ Customize modal CSS z-index. 
✅ Customize spinner icon color. 
✅ Customize spinner icon size. 
✅ Customize WC Gallery border color. 
✅ Customize WC Gallery icon color. 
✅ Customize WC Gallery icon background color. 
✅ Customize WC Gallery icon size. 
✅ Customize WC product image border. 
✅ Customize WC Gallery thumbnails gap. 
✅ Customize WC Gallery thumbnails number in row. 
✅ Customize product title color. 
✅ Customize product title font size. 
✅ Customize product title font weight. 
✅ Customize price color. 
✅ Customize price font size. 
✅ Customize rating stars color. 
✅ Customize misc buttons inside modal box color. 
✅ More customization options, give it a try.
💎 PRO
<a href="https://addonify.com/product/addonify-quick-view-for-woocommerce/" rel="nofollow ugc">Addonify Quick View Pro</a> version comes with more advanced features and customization options. Some of the features are:
✅ Track the viewed products with analytics. 
✅ Add the related products in quick view modal. 
✅ Add product navigation. 
✅ Enable social sharing from quick view modal. 
✅ Enable AJAX add to cart in quick view modal. 
✅ Unlock additional color options. 
✅ Unlock additional options to customize the modal.
📄 SHORTCODE
The shortcode below can used to display quick view button.
[addonify_quick_view_button id=”1″ label=”Quick View” classes=”btn” icon=”icon_one” icon_position=”left”]
The shortcode attributes used are as follows:
<ul>
<li>id: Product id.</li>
<li>label: Button label.</li>
<li>classes: CSS classes.</li>
<li>icon: Button icon. Use any one attribute value from <code>icon_one</code>, <code>icon_two</code>, <code>icon_three</code>, …, <code>icon_six</code>.</li>
<li>icon_position: Button icon position if <code>icon</code> attribute is set. Use either <code>left</code> or <code>right</code>.</li>
</ul>
👨‍💻 DEVELOPER:
Developers, we got you. Follow the links below to easily customize Addonify Quick View as you like.
✅ Custom quick view button <a href="https://docs.addonify.com/kb/quick-view/developer/" rel="nofollow ugc">Check Doc</a> 
✅ Using Hooks & Filters <a href="https://docs.addonify.com/kb/quick-view/developer/" rel="nofollow ugc">Check Doc</a> 
✅ Overwrite plugin template file <a href="https://docs.addonify.com/kb/quick-view/developer/" rel="nofollow ugc">Check Doc</a> 
✅ JavaScript API <a href="https://docs.addonify.com/kb/quick-view/developer/javascript-events/" rel="nofollow ugc">Check Doc</a>
Still not sure how to start? Create <a href="https://github.com/addonify/addonify-quick-view/discussions" rel="nofollow ugc">a new discussion</a> and we will help you out.
🤎 FEEDBACK & SUPPORT:
Let’s make Addonify Quick View better together. We are open to discuss how we can improve our plugin. You’re always welcome to join the discussion and share your ideas with us.
🌍 Feedback – <a href="https://github.com/addonify/addonify-quick-view/discussions" rel="nofollow ugc">Have feedback</a> or <a href="https://wordpress.org/support/plugin/addonify-quick-view/reviews/" rel="ugc">I would love to rate</a>. 
🪲 Report BUG – <a href="https://github.com/addonify/addonify-quick-view/issues" rel="nofollow ugc">Option – 1</a> or <a href="https://wordpress.org/support/plugin/addonify-quick-view/" rel="ugc">Option – 2</a>.
📦 UPCOMING FEATURES:
<ul>
<li>Modal width with responsive control.</li>
<li>Modal padding with responsive control.</li>
<li>Modal content gap with responsive control.</li>
<li>Quick view for Gutenberg WooCommerce products blocks.</li>
<li>More customization options.</li>
<li>Do you have any requests to make? <a href="https://github.com/addonify/addonify-quick-view/discussions" rel="nofollow ugc">Let’s discuss</a> on what you would like to see in the next version.</li>
</ul>

Addonify – Quick View For WooCommerce

Addonify WooCommerce Quick View plugin adds functionality to have a quick preview of WooCommerce product on a popup modal.

CSSIgniter Quick View for WooCommerce vs Addonify – Quick View For WooCommerce