包简介

Magento 2 module for quick product preview without page reloading. Fully configurable, compatible with all product types and optimized for performance.

README 文档

README

SPONSOR: Amadeco

A highly configurable QuickView module for Magento 2 that allows customers to quickly preview product details without leaving the current page. Engineered for performance and strict adherence to modern Magento coding standards.

Features

Performance Optimized: Implements IntersectionObserver for lazy loading of QuickView buttons, reducing initial DOM impact.
Modern Architecture: Built on PHP 8.3 using strict typing, constructor promotion, and readonly properties.
Broad Compatibility: Supports all product types (Simple, Configurable, Grouped, Bundle, Downloadable, Virtual).
AJAX-Powered: Fast loading of modal content.
Fully Responsive: Adapts seamlessly to mobile and desktop viewports.
Theme Friendly: Extensive configuration options to target specific CSS selectors.
Seamless Integration: "Add to Cart" functionality without page reload.

Requirements

Magento: 2.4.6+ (Tested on 2.4.8)
PHP: 8.3 (Strict Requirement)
jQuery: (Included in Magento)

Installation

Using Composer (Recommended)

composer require amadeco/module-quickview
bin/magento module:enable Amadeco_QuickView
bin/magento setup:upgrade
bin/magento setup:di:compile
bin/magento setup:static-content:deploy

Manual Installation

Create directory app/code/Amadeco/QuickView in your Magento installation.
Clone or download this repository into that directory.
Enable the module and update the database:

bin/magento module:enable Amadeco_QuickView
bin/magento setup:upgrade
bin/magento setup:di:compile
bin/magento setup:static-content:deploy

Configuration

Navigate to Stores > Configuration > Amadeco > Quick View.

General Settings:

Enable/Disable the module.
Elements Selector: Define which product container triggers the button initialization (default: .product-item).
Button Container: Specify where to inject the button (default: .product-item-info).
Button Label: Customize the text (e.g., "Quick View").

Modal Settings:

Set Modal Title.
Toggle visibility for Product Details, Reviews, and Downloadable Samples.
Enable/Disable "Go to Product" button.

Theme Selectors:

Customize CSS selectors for Tabs and Review links to match your theme's structure.

HTML Identifiers Replacement:

Advanced configuration to swap HTML IDs or Classes dynamically within the modal to prevent conflicts with the main page.

Customisation

The module is designed to be highly customizable. You can configure almost all behavior via Magento's Layout XML system, avoiding the need to write custom JavaScript for simple configuration changes.

Customizing via Layout XML (Recommended)

To change options like selectors, labels, or disable lazy loading, extend the layout in your theme (e.g., app/design/frontend/Vendor/Theme/Amadeco_QuickView/layout/default.xml).

Target the amadeco.quickview.init block and define arguments in jsLayout:

<?xml version="1.0"?>
<page xmlns:xsi="[http://www.w3.org/2001/XMLSchema-instance](http://www.w3.org/2001/XMLSchema-instance)" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="amadeco.quickview.init">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="lazy" xsi:type="boolean">false</item>
                    
                    <item name="modalTitle" xsi:type="string" translate="true">Fast Preview</item>
                    
                    <item name="selectors" xsi:type="array">
                        <item name="btnContainer" xsi:type="string">.custom-photo-container</item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

CSS Customization

The module includes minimal styling. You can extend the styling in your theme by targeting these classes: CSS

.quickview-button       /* The trigger button */
.quickview-wrapper      /* The main modal wrapper */
.quickview-media        /* Left column (Images) */
.quickview-main         /* Right column (Details) */

Contributing

Contributions are welcome! Please read our Contributing Guidelines.

Support

For issues or feature requests, please create an issue on our GitHub repository.

License

This module is licensed under the Open Software License ("OSL") v3.0. See the LICENSE.txt file for details.

amadeco/module-quickview 适用场景与选型建议

amadeco/module-quickview 是一款基于 PHP 开发的 Composer 扩展包，目前已累计 22 次下载、GitHub Stars 达 0，最近一次更新时间为 2025 年 03 月 27 日，在 PHP 生态内属于活跃度较高的组件。

它主要适用于以下技术方向：「catalog」「navigation」「modal」「magento」「ux」「magento2」等业务场景。在实际项目中，围绕这些方向常见需要落地的问题包括：接口对接、性能调优、并发安全、与既有框架（Laravel / ThinkPHP / Yii / Webman 等）的兼容适配，以及生产环境的日志埋点与稳定性保障。

我们在过去多个企业项目中使用过 amadeco/module-quickview 或与其功能相近的方案，如果你在选型或落地过程中遇到问题，例如 版本兼容、二次改造、私有化封装、与内部系统对接、生产 BUG 排查，欢迎联系我们协助评估。

围绕 amadeco/module-quickview 我们能提供哪些服务？

定制开发 / 二次开发

基于 amadeco/module-quickview 在你已有业务上做功能扩展、字段裁剪、UI 适配、与内部账号 / 权限 / 日志系统的深度对接。

BUG 修复 & 性能优化

线上偶发问题、内存泄漏、慢查询、并发异常等排查修复；针对高流量场景做缓存、队列、索引层面的调优。

项目外包 & 长期维护

承接完整的项目从需求 → 设计 → 开发 → 上线 → 长期运维；也可按月提供技术保姆服务。

yvsm@zunyunkeji.com QQ：316430983 微信：yvsm316 西安尊云信息科技 · 专注 PHP / Go / 分布式系统研发

与 amadeco/module-quickview 相关的其它包

同方向 / 同关键字的高下载量 PHP Composer 包推荐，方便对比选型：

dynamic/silverstripe-elemental-section-navigation 0

A block to display a list of links to child pages, or pages in current level

levmyshkin/micromodal 0

Fork from ghosh/Micromodal. Tiny, dependency-free javascript library for creating accessible modal dialogs.

sanzgrapher/filament-draggable-modal 18

Make Filament modals draggable.

yousefaman/filament-modal-repeater 17

A Filament form component that displays repeater items in a table with modal-based editing.

ahmed-hussain/hasmany-to-modal 1

A Laravel Nova field. To create a modal for creating or viewing related HasMany records without leaving the index page

antkaz/yii2-ajax 2

amadeco/module-quickview

包简介

关键字：