Menu Close
    Start a Project Request quote Reading list Switch to dark mode
    prestashop-hyperlocal-marketplace-guide

    Prestashop Product List Add to Cart Button

    Prestashop product list add to cart button module adds an ‘add to cart’ button on the product list. Additionally, it also adds a quantity input box next to the ‘add to cart’ button. To enhance the appearance of the button, customization options are also available.

    Cart overview is another important feature of the module. This feature helps to show the products added in cart in the drop-down menu. In the case of a product with combinations, quick view popup opens to select the combination of the product.

    Features of the module

    • Show or hide the add to cart button from the product catalog.
    • Enable or disable the display of the quantity input box from the product catalog.
    • Select the pages to use this feature on the product catalog.
    • Customize the appearance of add to cart button.
    • Enable the display of checked icon on the button once the product is added to the cart.
    • Customize the text to show on the button after the product is successfully added to the cart.
    • Add icon on the ‘Add to cart’ button.
    • Use google material icon to show on the ‘add to cart’ button.
    • Customize the text to show on the ‘Add to cart’ button.
    • Enable cart overview to show products of the cart in the drop-down menu.
    • Enable quick view popup to provide an option of selecting combination of the product.

    How to Install the Module

    1. Go to Module Manager in Back office and click on ‘upload a module’.
    2. Now, Drag and drop the module file or select the file from the system.
    3. In this way, the module installation will be successful.

    How to configure the module

    The configuration page consists of multiple tabs.

    General Settings

    Under general settings, choose to show or hide the add to cart button. Also, show or hide the quantity input box from the product catalog.

    You can also, choose the pages to show this functionality on the product catalog.

    Button Design

    This section of the configuration provides you with the option to customize the look of the button.

    Cart Overview

    Here in this section, you can enable the option to display cart drop-down.

    Pop-up Quick View

    On enabling this option, customer can view the quick view pop-up after clicking on ‘add to cart’ button. This option will be useful in case the product has several combinations. It will open the quick view popup to select the combination of product to add in the cart.

    Front-end workflow

    After configuring the module successfully, following changes can be observed at the front-end. On the product catalog, add to cart button & a box to choose the quantity of product becomes available.

    Same functionality becomes available on the search result page & category page.

    Search Result Page

    Category Page

    In the following screenshot, you can see the customized ‘add to cart’ button.

    As per the setting, the background & text colour of the button will change on hovering the cursor over it.

    On successfully adding the product to cart, the button text will change along with the checked icon.

    The screenshot below shows the drop-down menu of the cart. All the product added in the cart will also be available in the drop-down menu.

    To select the combination of the product, quick view popup will open on clicking the ‘Add to cart’ button.

    So, that was all about Prestashop Product List Add to Cart Button module.

    Support

    For any kind of technical assistance, just raise a ticket at http://webkul.uvdesk.com and for any doubt contact us at support@webkul.com

    Current Product Version - 4.0.0

    Supported Framework Version - 1.7.x.x

    . . .

    Comment

    Add Your Comment

    Be the first to comment.

    Back to Top
    css.php
    Hire Us!
    Brief us about your requirements and we'll get back to you.
    Woo! Hooy!
    We have just recieved your project brief and our expert will contact you shortly.
    Send Again
    Close

    Table of Content

    Hide Index