Reading list Switch to dark mode

    Opencart Replace Add to Cart Button

    Updated 11 October 2023

    To make the Add to Cart button perform multiple actions on Opencart Replace Add to Cart Button can be an interesting feature for the Opencart store.

    The Add to Cart button is an important aspect of any online store and therefore adding more functionalities to it can benefit the store owner.

    Opencart Replace Add to Cart Button module facilitates the admin to add multiple actions to an Add to Cart button such as Text, Email, Link, Phone etc.

    The admin will have to define a Type and then choose an action that will get the functionalities of the Type which the admin defines.

    Most of all, the additional functionalities of the Add to Cart button will simplify things for the customers.

    Searching for an experienced
    Opencart Company ?
    Find out More

    Just by clicking on the add to cart button, the customers can perform various functions without having to run from pillar to post on visiting an online store.

    Note:

    1. This module supports all templates and themes including the Journal theme.

    2. Opencart Replace Add to Cart Button module supports the Multi-Store feature of default Opencart.

    Watch the below video tutorial to understand the extension workflow:

    50i_dVLeZ2I

    Features

    • The admin can define a Type such as Text, Link, Email, Phone.
    • The admin chooses the action such as link, text, email phone for the type defined.
    • If Text type and action are chosen, then the text of the Add to Cart button changes.
    • Under link type and action, the admin provides a link on which the customer redirects.
    • Through Email type and action, the mail is sent to the admin as well as the customer.
    • Under Phone type and action, the contact details like email and phone number are visible to the customer.
    • The admin can also choose a different Action with a Type in the admin panel.

    Installation

    Upload Filesinstallation

    First, extract the downloaded zip file. After that, open the correct Opencart Version Folder. According to Opencart Version installed in your system.

    Then, upload admin and catalog to the Opencart root directory.

    Refresh Modifications

    replace add to cart button

    The user can navigate through Extensions > Modifications. Now click the Refresh button as visible in the below screenshot.

    Edit User Groupsreplace add to cart button

    After that, go to System > Users > Usergroups. And then edit ‘Administrator’. Click Select All for both Access Permission and Modify Permission and Save it.

    Installreplace add to cart

    Now navigate to Extensions > Modules. Find Webkul Replace Add to Cart from the list. Click the Install button as visible in the screenshot below.

    Module Configuration

    After the successfully installing the Opencart Replace Add to Cart Button module, the admin can view the Opencart Replace Add to Cart Button tab under Extension > Extensions > Modules.

    extension

    The Add to Cart Button functionalities can managed by The admin under Extension > Extensions > Modules > Webkul Replace Add to Cart


    modules

    The admin can click on the edit button for the Webkul Replace Add to Cart.

    On clicking the edit button, the user can view the Status field, Store field, Type Field and the Action Field.

    The admin will have to choose any of the Type tabs as per the requirement.

    Once the Type is chosen, thereafter, the admin can choose an action from the given list against the Action tab such as none, text, link email, phone.

     

    replace add to cart

    If the admin chooses ‘None’ against the action button, then no action is performed on tapping the add to cart button.

    Choosing a Type with an Action

    Let us understand how a Type works when a specific Action is chosen in the backend.

    When admin chooses Type as “Text” and Action as ‘Text’-:

    replace add to cart

    In the backend, the admin will choose ‘Text’ against the “Type” tab and against the “Action” tab the admin will choose ‘Text’ as shown in the image below.

    Thereafter, the customer will log in to the frontend and choose a product from the product page.

    The label of the add to cart button changes to DEMO PRODUCT as defined by the admin in the backend,  as ‘Text’ and Action as ‘Text’ while configuring the module.

    product page

    When admin chooses Type as “Link” and Action as ‘Link’-:

    The admin will have to choose ‘Link’ against the “Type” tab and ‘Link’ against the action button as well as shown in the image below.

    Against the “Type” tab on choosing ‘Link’ the admin will have to add the route link, for instance, of a category or a product or a page.

    link

    It redirects the customer directly to the category or product or page on clicking the add to cart button.

    replace add to cart

    On clicking the Demo Product button for MacBook Air, it redirects the user to the link which the admin adds in the backend.

    replace add to cart

    The admin adds the link of the Category- ‘Camera’ in the backend on which the customer redirects on clicking the Demo Product button as shown in the image.

    When admin chooses Type as “Email” and Action as ‘Email’-:

    On choosing the “Type” as ‘Email’ two options for Email will be visible – Admin and Custom as shown in the image below.

    admin

    If the Admin option is chosen from the given list, the mail is sent to admin.

    replace add to cart

    On choosing the “Email” tab, if the admin chooses the Email type as ‘Custom’, the custom email id is to be given against the ‘Email to’ tab on which the mail will be sent.

    replace add to cart

    In the product page, the customer will choose a product and click on Demo Product button as shown in the image below.

    replace add to cart

    On clicking the Demo Product button, a pop up will appear where the customer will have to fill in the Subject, Mail From details, and add questions under Ask tab.

    When admin chooses Type as “Phone” and Action as “Phone”-:

    As the admin chooses ‘Phone’ against the “Type” tab, another tab to enter the Phone will be visible where the admin enters the contact details as shown in the image below.

    replace add to cart

    In the frontend, the customer will choose a product and click on the Demo Product button.

    replace add to cart

    On clicking the Demo Product button, a pop up will appear displaying the contact details like email and phone number which the admin has set in the backend.

    The admin can also choose any type against the “Type” tab and any action option against the  “Action” tab.

    For instance, let’s consider the following scenario:

    When admin chooses Type as “Text” and Action as “Link”-:

    The admin will choose ‘Text’ against the “Type” tab and ‘Link’ against the “Action” button.replace add to cart

    The customer will have to choose a product from the product page and click on the Demo Product button.

    replace add to cart

    As the admin has chosen ‘Link’ against the “Action” button, on clicking the Demo Product, it redirects the customer to a category, or a page or a link which the admin adds in the admin panel.

    replace add to cart

    That’s all for Opencart Replace Add to Cart Button module. If you still have any issues, feel free to add a ticket and let us know your views on our Webkul Support System.

    Current Product Version - 1.0.0.1

    Supported Framework Version - 2.3.x.x

    . . .

    Leave a Comment

    Your email address will not be published. Required fields are marked*


    Be the first to comment.

    Back to Top

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home

    Table of Content