Loading...

Magento 2 Ajax Add To Cart and Quick View.

Rating:
93%
$0.00

Sales questions or looking to customize this extension? Reach out to us HERE

 Extension included in Extension included in Pearl Theme Magento 2 Extension included in Stack Framework for Magento 2
$0.00  Free version $149.00  Pro version
Links

All Quick View and Ajax Cart Free Features

SEO Optimized (no index/follow, canonical url options)

Quickview design #2, DEMO here

Quickview as Hotspot Widget, DEMO here

Close on background click

Global Custom Message - For all products

Dynamic Custom Message - For rule-based products

Enable on Mobile

Next/Prev Functionality

Enable on Search Results Page

Choose Loading Overlay color

Choose Loading Overlay opacity

Use Custom Loading Placeholder GIF animation

1 Minute Installation GUI

1 Month free support included

Free Version

Magento Quick View Examples.

About the Magento 2 Ajax Add To Cart and Quick View Extension.

Quick View allows users to get a quick look of products without opening the product page.

Add quick view functionality to any button, image, or product from a category listing page, product widget, recommended products or upsell. You can even embed your products on CMS pages or even create lookbook hotspots.

You can easily add to cart any product without leaving the current page by using the Quick View functionality. A popup window, with product details, will appear for each element that is defined to use this functionality: button, image, listing page product, product widget, recommended products or upsell. Easy to configure from settings. You can enable visibility for many elements/sections from quick view. Product zoom available on product page can also be enabled or disabled in quick view pop-up.

You can make this extension your own by configuring all the available options in admin: easily change the looks of the quickview box by using Custom CSS area from admin, control "Continue shopping" and "Go to Checkout" buttons, control where quick view pop-up opens (center, left or right), define number of seconds after the quick view box is closed, other useful settings.

Raise your advertising game to new heights with the Custom Global and Custom Dynamic Messages for the Quick View Popup. You can add messages that showcase promos, discounts or other important information about your products at the top of the Quick View Popup window. The messages can even be Dynamic, meaning they only show up on specfic products defined by Magento Conditions.

Main features

  • Hide/Display product image, product thumbnail image, short description, qty selector, product availibity, SKU
  • Select Quick view button style
  • Enable/Disable 'Go to product' button in quickview frame
  • Close quickview in X seconds after adding product to cart
  • Enable/Disable to Auto scroll to top and open Quickcart
  • Enable/Disable the pop-up with Continue shopping/Go to Checkout buttons displayed after Add to cart is clicked
  • Enable/Disable zoom on product image from Quick view pop-up
  • Add Quick view functionality to any button in your website and link specific product.
  • SEO Optimization features (PRO version only)
  • Display Quick View on Search Results Page (PRO version only)
  • Control the position where Quick View is displayed (center/left side/right side) DEMO CENTRED, DEMO RIGHT, DEMO LEFT (PRO version only)
  • Choose to Close when background is clicked (PRO version only)
  • Hotspot functionality, insert hotspots with quickview functionality and create awesome lookbooks, SEE HOTSPOT DEMO (PRO version only)
  • Add a Global Custom Message to the Quick View Popup to showcase discounts and other promos on your site (PRO version only)
  • Add multiple Dynamic Custom Message to the Quick View Popup to showcase discounts and other promos for products, based on easy to configure Magento Conditions (PRO version only)
  • Display Quick View on mobile (PRO version only)
  • Display Quick View on the Search Results Page (PRO version only)
  • Allow users to easily cycle between products on the Category Page in the Quick View window with the Prev/Next functionality (PRO version only)

1 MINUTE INSTALLATION GUI.

  • Step 1:
    Before installing please check the extension compatibility. This extension is currently compatible with the following Magento versions 2.0.X. - 2.3.5. It is recommended to install the extension first on a testing server before you install it on a live (production) server.
  • Step 2:
    Copy the extension files to below paths of your magento 2 instance. If 'app/code/WeltPixel' folder is missing, please create it manually:
    app/code/WeltPixel/Backend
    app/code/WeltPixel/Quickview
  • Step 3:
    Copy the installation GUI folder 'weltpixel-extension-installation' in the root of your Magento installation. In some Magento configurations the public root folder may be under 'pub' directory.
    www.yourmagentostore.com/weltpixel-extension-installation/
  • Step 4:
    In your browser go to www.yourmagentostore.com/weltpixel-extension-installation/ and simply follow the installation steps from the graphical interface, presented in your browser. See the installation video: 1 Minute Module Installation via browser GUI.
  • Step 5:
    Wooohooo! The extension is now installed on your Magento store! Congrats!

Troubleshooting

If you experienced any issues or limitations with this quick GUI installation, see also SSH Installation below. SSH installation does the same thing but you are required to issue the commands step by step via CLI. Some servers may have high security configurations and may limit the functionality of this GUI Installer.

How to Install via SSH.

  • Step 1: Before installing Advanced Product Quick View and Ajax Cart Extension on a Magento 2 store please check the extension compatibility. This extension is currently compatible with the following Magento versions: 2.0.X. - 2.3.5. It is recommended to install the extension first on a testing server before you install it on a live (production) server.
  • Step 2: Copy the extension files to below path of your magento 2 instance. If 'app/code/WeltPixel' folder is missing, please create it manually.
    app/code/WeltPixel/Backend
    app/code/WeltPixel/Quickview
  • Step 3: Access the root of your Magento 2 project from command line and run the following commands:
    php bin/magento module:enable WeltPixel_Backend --clear-static-content
    php bin/magento module:enable WeltPixel_Quickview --clear-static-content
    php bin/magento setup:upgrade
  • Step 4: Flush any cache that you might still have enabled on your server or in Magento.
  • Step 5: Woohoo! the extension is now fully installed!

How to Upgrade the extension.

  • Step 1. Remove extension code under app/code/WeltPixel/Quickview before adding the new extension files. The extension may be refactored and old unused files may cause random issues so it's best to only keep the latest version of the files.
  • Step 2. Follow normal installation instructions above.
Magento 2 Ajax Add to Cart & Quick View Extension configuration screen 1

How to Enable or Disable Ajax Add to Cart & Quick View in Magento?

  • Go to Admin > WeltPixel > Quickview and Ajax Cart > General
  • You can customize the extension by completing the fields listed in the left image:
  • General
    • Enable on product listing [ Yes / No ] Enable / Disable quick view on product listing
    • Enable on search result [ Yes / No ] Enable / Disable quick view on the Search Results page
    • Enable on mobile view [ Yes / No ] Enable / Disable quick view on mobile (PRO version only)
    • Quickview Type (PRO version only)
      • [Default] - Quickview pop-up displayed in the center of the page
      • [Right side] - Quickview Slides in the right side of page
      • [Left side] - Quickview Slides in the left side of page
    • Close on Background Click (PRO version only) [ Yes / No ] Enable / Disable to close Quickview pop-up when page background is clicked
    • Remove product image [ Yes / No ] Show / Hide main product image
    • Remove product image thumb [ Yes / No ] Show / Hide thumbnails below main product picture
    • Remove short description [ Yes / No ] Show / Hide short description of products
    • Remove qty selector [ Yes / No ] Show / Hide product quantity selector in quick view
    • Enable go to product button [ Yes / No ] Show / hide “go to product” button in quick view
    • Remove availability [ Yes / No ] Show / hide product availability in quick view
    • Remove sku [ Yes / No ] Show / Hide product sku in quick view
    • Button style [ Version 1 / Version 2] Select between 2 types of quick view buttons on product listing page
    • After adding product to cart, close quick view in X seconds [ Number ] Number of seconds after quick view closes automatically. If you enter 0, it will remain open until you close it.
    • Auto scroll to top and open mini cart [ Yes / No ] Enable / Disable auto scroll to top of the page and open mini cart
    • Enable continue shopping / go to checkout buttons [ Yes / No ] After add to cart, Show / Hide navigation buttons “Continue Shopping / Go to Checkout”
    • Custom CSS [ CSS code ] Enter custom CSS code and easily change the way quick view looks
    • Enable Zoom [ Yes / No ] Enable / Disable zoom on product picture shown in quick view
    • Loading Overlay Background Color - Choose the Overlay Background Color for the Quickview loading effect. (PRO version only)
    • Loading Overlay Opacity - Choose the Overlay Opacity for the Quickview loading effect. Use values between 0 and 1. For example, 0.8. (PRO version only)
    • Loading Placeholder [ Yes / No ] Set to yes to be able to upload your own loading placeholder. (PRO version only)
    • Loading Icon - Upload your custom Loading Icon. (PRO version only)
    • Enable Previous / Next products - [ Yes / No ] Set to yes to allow customers to cycle between products on the Category Page within the Quick View window. (PRO version only)
    Magento 2 Ajax Add to Cart & Quick View Extension configuration screen 2
    Magento 2 Ajax Add to Cart & Quick View Extension configuration SEO optimization

    How Optimize Ajax Add to Cart & Quick View for SEO in Magento?

    • Add no follow for the quickview link (PRO version only) [ Yes / No ] Add / Remove rel="nofollow" to / from the Quickview links
    • Add no index (PRO version only) [ Yes / No ] Add / Remove meta name="robots" content "NOINDEX,FOLLOW" to / from the head tag of the Quick view pop-up
    • Add canonical link (PRO version only) [ Yes / No ] Add / Remove canonical link for / from Quickview pop-up

    What Else Can I Do with Ajax Add to Cart & Quick View in Magento?

    Advanced Settings

    Besides listing pages, quick view functionality can also be used in lookbooks, cms pages, blocks or anywhere in your magento2 store.

    Check live quick view functionality on Pearl Theme presentation page.
    You can see quick view in action by clicking "Buy Now" button.
    Magento 2 Ajax Add to Cart & Quick View Extension advanced settings pricing screen
    Magento 2 Ajax Add to Cart & Quick View Extension configuration quick view on cms blocks

    How to Configure Quick View on CMS Pages & Blocks in Magento?

    • 1. You can add the quick view functionality using the following code:

      <a href="javascript: void(0);" data-quickview-url="
      weltpixel_quickview/catalog_product/view/id/11"
      class="weltpixel-quickview"> <div class="title">
      Your text here</div> </a>
      

    • 2. ...but be sure to replace "id/11" from example with your product ID from your store , in order to find your ID, in admin go to Products > Catalog to the specific product.

    • 3. Put your final code in the content of your specific page or block.

    How to Configure Quick View as Hot Spots in Magento?

    You can add the quick view hotspot functionality by following next steps:

    1. Go to your CMS page which is the lookbook

    2. Click Insert Widget button

    3. Select Widget Type to be WeltPixel - Quickview Hotspot

    4. Complete the hotspot configuration

    5. Click Insert Widget button to insert the hotspot widget in your CMS page

    Magento 2 Ajax Add to Cart & Quick View Extension configuration hotspots on lookbooks
    Magento 2 Ajax Add to Cart & Quick View Extension configuration image hotspot



      Please make sure to add the widget into a div with the class name "wp-hotspot-quickview" that contains the image tag and the hotspot quickview widget..

      You can add the quick view hotspot functionality using the following code:

      <div class="wp-hotspot-quickview">
      <img src="my_image.jpg" style="width: 100%" alt="my image">
      
      </div>
      

    Multiple Hotspots Can Be Inserted in One Image.

    Magento 2 Ajax Add to Cart & Quick View Extension multiple hotspot example on front end
    Magento 2 Ajax Add to Cart & Quick View Extension Custom Global Message

    Custom Global Message. (PRO version only)

    • Enable Custom Global Message [ Yes / No ] - Enable/disable the Custom Global Message functionality, displayed above the Quick View popup.
    • Enable Dynamic Custom Message [ Yes / No ] - If set to Yes, you can use Custom Dynamic Messages based on rules. Dynamic messages have priority over Global messages.
    • Custom Global - Add your Custom Global Message to be displayed in this text box.
    • Custom Global Background Color - Select the background color of the Custom Global Message container.
    • Custom Global Font Color - Select the font color for the Custom Global Message text.
    • Custom Global Font Size - Select the font size for the Custom Global Message text.
    • Custom CSS - Add your own Custom CSS to the Custom Global Message container and text, by targeting them with the IDs provided.

    Dynamic Quick View Custom Messages. (PRO version only)

    If you've enabled the Dynamic Custom Message functionality, you can add Dynamic Custom Messages based on Magento Conditions to advertise specific discounts, promotions or to let your customers know important information regarding specific products. To add a Dynamic Message, click the Add New Custom Message button.

    Magento 2 Ajax Add to Cart & Quick View Extension Custom Message Grid
    Magento 2 Ajax Add to Cart & Quick View Extension Custom Message Configuration 1

    Edit Dynamic Custom Message.

    • Title - Choose the title of your Dynamic Custom Message.
    • Priority - Set the priority of your Dynamic Custom Message. Use "0" for the highest priority and larger values for lower priorities.
    • Status [ Active / Inactive ] - Activate or deactivate your Dynamic Custom Message.
    • Valid From/Valid To - Choose specific dates from and to which the validity of the Dynamic Custom Message is applied.
    • Store View - Choose the Store Views on which you want to apply the Dynamic Custom Message.
    • Customer Group - Choose specific Customer Groups to which to display the Dynamic Custom Message.
    • Text - Add the text you want to display for your Dynamic Custom Message.
    • Text Background Color - Set the background color for the Dynamic Custom Message container.
    • Text Font Color - Set the font color for the Dynamic Custom Message text.
    Magento 2 Ajax Add to Cart & Quick View Extension Custom Message Configuration 2
    Magento 2 Ajax Add to Cart & Quick View Extension Custom Message Configuration 3
    • Text Font Size - Set the font size for the Dynamic Custom Message text.
    • Custom CSS - Add your own Custom CSS to the Dynamic Custom Message container and text, by targeting them with the IDs provided.
    • Conditions - Set up Conditions or combinations of Conditions in order to display the Dynamic Custom Message on specific products. For example, you can choose a condition based on Product SKU and choose the SKUs associated with products in your store. Your Dynamic Custom Message will then only display on those products.
    Tech Specifications
    CompatibilityMagento Open Source, Magento Commerce, Magento Commerce Cloud B2B
    Magento version2.0, 2.1, 2.2, 2.3.0, 2.3.1, 2.3.2, 2.3.3, 2.3.4, 2.3.5
    Updates costFree lifetime updates
    Update frequencyMonthly or each time a new Magento version is released
    Support period1 Month Free Support, with options to extend
    Refund period30 days, for any reason
    UpdatedMay 07, 2020
    Code100% Open Source Code
    Bundle optionsFor best value buy it as part of the Pearl Theme or Stack Framework
    Write Your Own Review
    You're reviewing:Magento 2 Ajax Add To Cart and Quick View.
    Your Rating

    Change Log.

    What’s new in v.1.9.8 - July 6, 2020

    • Fixed a bug which prevented the Enable/Disable Zoom option from working correctly.
    • Whitelisted domain for Content Security Policies introduced in Magento 2.3.5.


    What’s new in v.1.9.7 - May 7, 2020

    • New feature (PRO version only) - Added Next/Prev buttons to the Quick View window which allow for cycling through products on Category Pages without closing Quick view.
    • New feature (PRO version only) - Introduced the possibility of adding the Quick View functionality to the Search Results Page.
    • Confirmed compatibility with Magento 2.3.5.
    • Implemented small Backend performance optimizations.
    • Added nxcli.net (Nexcess temporary URL) as a valid domain in the licensing process.
    • Added an option in the Developer section to allow for switching Magento's CSP between "report-only" and "restrict"


    What’s new in v.1.9.6 - April 9, 2020

    • New feature (PRO version only): You can now add a Custom Global Message/Custom Dynamic Message to your Quick View Popup, in which you can advertise discounts, promotions and display relevant information about your products to users.
    • Added the possibility of displaying the Quick View on mobile as well.
    • Added an option which allows the Estimated Delivery Date (requires the WeSupply Integration) to be hidden from the Quick View Popup.
    • Fixed a backend issue on Magento Commerce whereby the Category Schedule functionality was not working properly.


    What’s new in v.1.9.5 - March 10, 2020

    • Fixed an issue related to the Zoom Action setting via the Magento Admin.
    • Added backend Google reCaptcha compatibility for Magento 2.3.x


    What’s new in v.1.9.4 - February 5, 2020

    • Fixed an bug which caused a 404 error in the console when the module was disabled via the Magento Admin.
    • Code enhancements for increased security. Changed User Group info collection method.
    • Confirmed compatibility for Magento 2.3.4.


    What’s new in v.1.9.2 - November 27, 2019

    • Added Magento and PHP version in the WeltPixel Developer section.


    What’s new in v.1.9.1 - October 16, 2019

    • Fixed an issue related to a deprecated live jQuery event.
    • Confirmed compatibility with the latst Magento 2.3.3 version.
    • Included the WeSupply Toolbox integration extension - Proactive Notifications Email & SMS, Returns & RMA, Store Locator, Delivery Date Estimate, Logistics Analytics, NPS & CSAT score. Get Free on-boarding and launch within 24 hours.


    What's new in v.1.8.5 - June 7, 2019

    • Small performance improvements.


    What's new in v.1.8.4 - April 25, 2019

    • Added PHP version in the WeltPixel Developer Section.


    What's new in v.1.8.3 - April 3rd, 2019

    • Added Quick View functionality for List View mode on Category Pages.
    • Fixed Quick View Hotspot URL which can now be fetched with https.
    • Confirmed compatibility for Magento 2.3.1.


    What's new in v.1.8.2 - January 24, 2019

    • Helpcenter adjustment, removed Zendesk iframe and added a simple link to our Support Center in order to avoid any potential conflicts with other admin js added by 3rd party extensions.
    • Fix for multiple rewritten ImageFactory classes, rewrite check validity, rewrite checks optimizations.


    What's new in v.1.8.0 - December 8, 2018

    • Compatibility adjustments for Magento 2.1.16/2.2.7/2.3.0.
    • PHP 7.2 compatibility added.
    • As Magento 2.3 comes with major core changes, we have provided a different set of files in order to achieve the best performance on each version.


    What's new in v.1.7.5 - October 24, 2018

    • Fixed image position in quickview when using small images on product page, the image is now centered and not alligned right anymore.
    • Added detailed error messages for invalid licenses for an easier identification of the cause.
    • License improvements, added *.magento.cloud as a valid test domain for Enterprise Cloud environments. Now both 'magentosite.cloud' and 'magneto.cloud' can be used for testing purpose with the production domain license.


    What's new in v.1.7.4 - September 25, 2018

    • Optimization - Added admin dependancy options, css added only if enabled.
    • Admin menu styling to fit screen size 1366px.
    • Fix for production mode with merged JS - missing color pallet display now fixed.


    What's new in v.1.7.3 - August 23, 2018

    • License improvements, adding *.magento.cloud as a valid test domain.


    What's new in v.1.7.2 - August 2, 2018

    • Default hover value added, avoiding errors when this value is not set.
    • Fixed admin random logout issue.
    • Licensing improvements, allowing 3 letter domain as valid domain.


    What's new in v.1.7.1 - July 11, 2018

    • Compatibility with Magento 2.2.5 both Open Source & Commerce Cloud B2B.
    • Added domain.test & [any_subdomain].domain.test to the list of valid urls for staging/development environments. Added domain validation with port number included for licensing purpose.
    • Added licensing compatibility with Magento B2B.


    What's new in v.1.7.0 - July 5, 2018

    • Fixed Image Zoom hover out, not closing the magnifier.
    • Added option to enable/disable WeltPixel admin notifications.
    • Show store and server related information under debugging tab: Magento Mode, Magento Edition, Server User, Magento Installation Path, Current server time, Latest cron jobs.
    • Added licensing, license key needs to be generated under weltpixel.com account for purchased product, based on domain name and added under your magento installation.


    What's new in version 1.6.4 - May 16, 2018

    • Compatibility with Magento 2.2.4, logger broken reference fix, changed to rewrite from plugin.
    • Quick View PRO: Hotspot functionality, added detailed comment on how it should be used.
    • Remove main quantity box for grouped product type.


    What's new in version 1.6.3 - April 10, 2018

    • Quick View PRO: SEO Optimized (no index/follow, canonical url options).
    • Quick View PRO: Added Quick view design #2 (for mobile as well).
    • Quick View PRO: Added Hotspot widget with product quick view functionality.
    • Removed duplicated Gallery Plugin and merge into 1 the functionality. (FREE and PRO)


    What's new in version 1.6.0 - March 1st, 2018

    • Remove fullscreen zoom option as it is deprecated.
    • Compatibility adjustments with WeltPixel Ajax Catalog and Infinite Scroll.
    • Remove duplicate plugin declaration.

    What's new in version 1.5.8 - January 12, 2018

    • Added version control for installed WeltPixel modules, including latest version check.
    • Allowing error message to be displayed in quickview
    • Removed default magento messages from popup.
    • Fix for redirect after when out of stock, quick cart module conflict issue fix when both have show cart option enabled.


    What's new in version 1.5.7 - December 14, 2017

    • Added Support Center functionality in Magento Admin.
    • Added Debugger functionality, checks for rewrites and points potential issues.
    • Redirect to cart after add to cart quickview issue fix.

    What's new in version 1.5.3 - September 20, 2017

    • Adjusting the downloadable information, moved the product info right side and css common media query.
    • Added compatibility with Magento 2.2, missing product options fix.

    What's new in version 1.3.4 - May 16, 2017

    • Added translations files under /i18n/en_US.csv.

    What's new in version.1.3.1 - March 11, 2017

    • Changed product image position, fix for bundled products not showing up ok in quick view.

    What's new in version.1.0.8 - 02/02/2017

    • Changed composer PHP dependency versions to meet latest magneto release requirements

    What's new in version.1.0.7 - 01/02/2017

    • Fixed loading error when Google Tag Manager Enabled in Magento Enterprise 2.1.3
    • Refactored documentation in HTML format

    What's new in version.1.0.6 - 22/12/2016

    • Small design adjustments

    What's new in version.1.0.4 - 22/11/2016

    • Position middle to gallery

    What's new in version.1.0.3 - 10/10/2016

    • Composer dependency version changes

    What's new in version.1.0.2 - 02/07/2016

    • Compatibility with Magento 2.1

    What's new in version.1.0.1 - 05/06/2016

    • New feature: After adding product to cart close quick view in X seconds
    • New feature: Auto scroll to top and open quick
    • New feature: Enable continue shopping/go to checkout buttons
    • New feature: Enable / Disable zoom and magnifier options
    • Fixed: vertical thumbnails white space issue on left side, whitespace removed
    Recently Viewed
    No recently views items
    Clear All
    Newsletter Fashion Box
    How about a gift?