README

"Quick view" on the product cards of category, search and brand pages: the product in a dialog without leaving the list. The theme's <dialog> and HTMX; no script of its own.

Install

Requires Magento Open Source 2.4.7–2.4.9 and PHP 8.2–8.4 with the GD extension built with WebP (php -r 'var_dump(function_exists("imagewebp"));' says true; Magento's own PHP requirements cover the rest). Without WebP in GD, Zero skips its WebP image copies and serves the originals.

composer require fixstacks/module-zero-quick-view
bin/magento setup:upgrade
bin/magento setup:di:compile           # production mode
bin/magento setup:static-content:deploy # production mode
bin/magento cache:flush

Composer installs fixstacks/module-zero-core with it.

Part of fixstacks/zero, which installs the Zero theme and every Zero module at once.

On the storefront

The button sits on the card's photo (top end corner): with a mouse it shows on hover and keyboard focus, on a touch screen always. The Zero theme's product list renders the block zero.quickview.button on every card, as it does the badges.
The dialog (data-dialog-open, the theme's modal) loads the product from quickview/product/view?id=… (hx-get, "Loading…" while it comes): photo, name, the price as lists show it (special price, "As low as"), stock, a short summary, View full details.
Add to Cart right in the dialog for a product with nothing to choose (a plain POST to Magento's cart: the shopper lands back on the list with the usual message); a product with options (sizes, colours, required custom options, bundles) gets "Choose options", a link to its page.
Esc, the close button or a click outside closes it.

The fragment is never cached (it carries the visitor's form key and their group's price) and answers only for a product the store view lists (enabled, on its website, visible in the catalog).

Settings

Stores > Configuration > Zero > Quick View: on or off (off by default).

Tests

dev/tests/zero-e2e/tests/quick-view.spec.ts: open, add to cart from the dialog, a product with options, Esc.

License

OSL-3.0 or AFL-3.0, your choice: see NOTICE.md.

Zero is made by Fixstacks in partnership with Vilmate, a software development company. Documentation: https://fixstacks.com/zero/docs. Demo store: https://zero.fixstacks.com.

fixstacks / module-zero-quick-view

Package info

Security

Statistics