01 — Getting Started
Installation
Install Storzen Quick View directly from the WordPress Plugin Directory or by uploading the zip file manually.
Method A — From WordPress Dashboard
1
Go to Plugins → Add New
In your WordPress admin dashboard, navigate to Plugins → Add New Plugin.
2
Search for "Storzen Quick View"
Type Storzen Quick View in the search box and press Enter.
3
Install & Activate
Click Install Now next to the plugin, then click Activate.
4
Open Settings
After activation, a new Storzen QuickView menu item appears in your WordPress admin sidebar — click it to configure the plugin.
Method B — Manual Upload
1
Download the zip file
Download
storzen-quick-view-for-woocommerce.zip from wordpress.org or storzen.co.2
Upload via Plugins → Add New
Click Upload Plugin at the top, choose the zip file, and click Install Now.
3
Activate the plugin
Click Activate Plugin. A Storzen QuickView entry will appear in the WordPress admin sidebar.
After activation, visit your shop page — the Quick View button appears on product cards automatically with sensible defaults. No configuration required to get started.
02 — Requirements
Requirements
Before installing, make sure your store meets the following requirements.
| Requirement | Minimum Version | Notes |
|---|---|---|
| WordPress | 6.3 or higher | Tested up to 7.0 |
| WooCommerce | 6.0 or higher | Must be installed & active |
| PHP | 7.4 or higher | PHP 8.x recommended |
WooCommerce is required. Storzen Quick View will not activate without WooCommerce installed and active on your site.
03 — Configuration
General Settings
Go to Storzen QuickView → General in your WordPress admin sidebar to access these settings.
General
Enable Quick View
Show Quick View button on product listings.
Disable on mobile devices
Recommended for mobile-optimised checkouts.
Show On
Display pages
✅ Shop page ✅ Category pages ✅ Related products
| Setting | Description | Default |
|---|---|---|
| Enable Quick View | Master toggle — turns the Quick View button on or off across your entire store. | On |
| Disable on Mobile | Hides the Quick View button on phones and tablets. Useful if you prefer a full product page experience on mobile. | Off |
| Display Pages | Choose which pages show the Quick View button — Shop page, Category pages, or Related/upsell product sections. | All pages |
Button Settings
Go to Storzen QuickView → Button to configure the trigger button appearance and position.
Button Settings
Button Text
Label shown on the Quick View trigger button.
Button Position
Where the button appears on the product card.
● On product image
Button Icon
Enable icon in button
Show an icon alongside the button text.
Icon style
👁
🔍
🔎
| Setting | Description | Default |
|---|---|---|
| Button Text | The label shown on the Quick View button. You can change this to anything — e.g. "Preview", "Quick Look", "View Details". | Quick View |
| Button Position | Where the button appears on each product card. Choose from: On product image (hover overlay), Below product title, or Below product price. | On product image |
| Enable Icon | Show an icon alongside the button label. Toggle it off for a text-only button. | On |
| Icon Style | Choose from 5 built-in icon styles — eye (filled), eye (outline), eye (thin), search, or zoom. Visible when Enable Icon is On. | Eye (filled) |
Tip: "On product image" position works best for most themes — the button appears as a clean overlay when a customer hovers over the product image.
Display Settings
Go to Storzen QuickView → Display to control what appears inside the popup modal.
Modal Box
Show product rating
Display star rating inside the popup.
Show short description
Display the product excerpt inside the popup.
Show "View full details" link
Add a link to the full product page inside the popup.
| Setting | Description | Default |
|---|---|---|
| Show Product Rating | Displays the star rating and review count inside the Quick View popup. | On |
| Show Short Description | Shows the product's short description (excerpt) inside the popup. | On |
| Show "View full details" link | Adds a link at the bottom of the popup that takes the customer to the full product page. | On |
Keeping all three options enabled gives customers the most information — which typically leads to higher add-to-cart rates.
Design Controls
Go to Storzen QuickView → Design to customise the look of the Quick View button and popup — no code required.
All customisation is done through structured form controls. The plugin generates the necessary CSS automatically from your choices.
Button Colours
Button background colour
Fill colour of the Quick View trigger button.
Button text colour
Label and icon colour inside the button.
Shape & Size
Button border radius (px)
0 = square · 50 = pill shape
Modal max width (px)
480–1400 px range
| Setting | Description | Default |
|---|---|---|
| Button background colour | The fill colour of the Quick View trigger button. Uses a colour picker — click the swatch to open it. | #222222 |
| Button text colour | The colour of the button label and icon. Uses a colour picker. | #ffffff |
| Button border radius (px) | Controls the corner roundness of the button. 0 = square corners, 50 = fully rounded pill shape. Accepts values 0–50. |
4 |
| Modal max width (px) | The maximum width of the Quick View popup. Accepts values 480–1400 px. The popup is always responsive and will shrink on smaller screens. | 900 |
No CSS knowledge needed. All visual changes are made using the colour picker and number inputs above. The plugin handles generating the correct CSS automatically — just pick your colours, set your sizes, and save.
CSS selectors for theme developers
If you need finer control (e.g. from your theme's style.css or the WordPress Customizer's Additional CSS box), use these selectors:
| Selector | What it targets |
|---|---|
| .storzen-qv-trigger | The Quick View button on product cards |
| .storzen-qv-overlay | The dark background behind the popup |
| .storzen-qv-modal | The popup container |
| .storzen-qv-title | Product name inside the popup |
| .storzen-qv-price | Product price inside the popup |
| .storzen-qv-add-to-cart | Add to Cart button inside the popup |
| .storzen-qv-close | The × close button |
Add your custom CSS in Appearance → Customize → Additional CSS (built into WordPress) — this is the recommended way to add any extra styling beyond what the Design panel offers.
04 — Help
Frequently Asked Questions
The Quick View button is not showing on my shop page.
Check these things in order:
- Go to Storzen QuickView → General and make sure Enable Quick View is turned On.
- Make sure the Display Pages setting includes "Shop page".
- If you have "Disable on Mobile" turned On and you're viewing on a phone, the button will be hidden by design.
- Clear your browser cache and any caching plugins.
Where is the Storzen QuickView settings page?
After activating the plugin, look for Storzen QuickView in your WordPress admin sidebar — it appears as its own top-level menu item (with an eye icon), not under WooCommerce. Click it to open the settings page.
Does Quick View work with variable products (size, color options)?
For variable products, the free version shows a "View Product" link inside the popup. Full variation support — selecting size, color, and other attributes inside the popup — is available in Storzen Pro. Visit storzen.co to learn more.
How do I change the button colour or popup width?
Go to Storzen QuickView → Design. Use the colour pickers to set your button background and text colours, and the number inputs to set the border radius and modal max width. Click Save Settings — no CSS editing required.
The popup styling looks off with my theme. How do I fix it?
Some themes add global CSS that can affect the popup appearance. You can add overrides in Appearance → Customize → Additional CSS using the selectors listed in the Design Controls section above. If you need help, open a support thread on the WordPress.org support forum.
Will this plugin slow down my store?
No. Storzen Quick View only loads its CSS and JavaScript on pages where the button is shown (shop, category, product pages). Assets are not loaded on any other pages like the checkout or homepage.
How do I close the Quick View popup?
Customers can close the popup by clicking the × button in the top-right corner, clicking anywhere on the dark background overlay, or pressing the Escape key on their keyboard.
Can I translate the plugin into my language?
Yes. Storzen Quick View is fully translation-ready. You can translate it using the WordPress.org translation platform or a plugin like Loco Translate.