Hi, today I am publishing another free Opencart module “Side bar Shopping Cart”and I made this for OpenCart version 126.96.36.199.Â Problem is we cannot edit js file with vQmod so you need to override the common.js file. But I have described where you need to put the extra code below in this post.
Js/CssÂ files are rendered at the browser level, not at the server level, so vQmod has no effect on these files. You can, however, create new files and use vQmod to alter the tpl files to point to these new css/js files.
Output after installing the module is shown as in the image below:
You can see how I copied the header cart section and show it as module inÂ side cart box or side shopping cart. You can show anywhere you like as this is module so you can show at left column, right column or top content or bottom content.
Download the module from here:
- Unzip the downloaded folder.
- Then activate the Shopping Cart module.
Activating the Side bar Shopping Cart module:
- After uploading files to servers, it’s time to install Side bar shopping cart module
- We are showing the side bar shopping cart at the right column but you can show it wherever you like as this is acts as normal module.
- Go to Admin section
- Then click on Extensions on left menu
- After that Click Modules and go to “Shopping Cart” in modules list
- Then click the Green button to install the module (see the image below)
- Then click blue edit button
- After that you will see the form which have status field, select “Enabled” and then click Save button.
- You module is active and is ready to used in layout.
Setup layout for the side bar shopping cart at home page:
- From the admin section go to System >> Â Design >> Layouts.
- You will see a list of layouts, from which edit the “Home” layout.
- Then click Blue add button to add rows at module section which is shown in the image below:
- Second you choose the Shopping Cart in module column and Column right in Position column and insert the sort order as required.
- Then Click save button
Your custom side bar shopping cart is showing in the right column of home page. Likewise you can show in many other layouts and pages.
Codes to added to common.js if you don’t want to override it:
- There are around 4 places where you have to add above code.
- Then save the common.js file and upload to server and module works perfectly.
- Your module is ready to use in other place except product detail page.
Making changes in product detail page to make our module works:
- Go to catalog/view/theme/YOURTHEMENAME/product/product.tpl
- Then save and upload to server and Sidebar shopping cart is ready to be used in product page also.
Now click add to cart button and see how shopping cart animation changes the details with the use of ajax functionality.
Let me know if you get any problem on performing above tasks in comment so that I can help if you have any.