Friday, 13 June 2014

How to create opencart Extension or Module with tools

Hi Friends, Today i am going to make you learn, How to create OpenCart extension with or without tool. For that you should have little bit knowledge of HTML, PHP and off course MySQL. So first of all i’ll tell you actually “What is open cart.”


Well this is an Open Source Shopping cart Solution, The development is based on a MVC framework, but which is designed exclusively for the shop system. Main features of opencart is given below -


  • Unlimited Categories

  • Unlimited Products

  • Unlimited Manufacturers

  • Multi Currency

  • Multi Language

  • Product Reviews

  • Product Ratings

  • Open Source

  • Free Documentation

  • Templatable

  • Automatic Image Resize

  • 20+ Payment Gateways

  • 8+ Shipping Methods

Including these opencart having one Front End and one Administration for managing front end. Except this Open Cart allow us to earn money. Now question is, How?


Cool, The Ans is, Open Cart allow us to make extension or module to customize the Open Cart as per user requirement, Now i will will show you how to make Open Cart Extension?


There are two method for creating Open Cart Extension -


  1. Using vQmod XML File Generator –  Before going further you should know “How to install Open Cart” for this, just download a latest copy of Open Cart from here and install at localhost or any host which supports PHP. Now download VQMOD and install, vqmod is required for vQmod XML File Generator for creating an extension. After successfully installation of vQmod XML File Generator, It will look like below image -

vqmod-xml-file-generator


 


Now you will have to fill all the fields as per your requirement and Generate a new XML file. Now upload it in “C:\xampp\htdocs\opencart\vqmod\xml” folder at localhost, but on the server you will have to use Filezilla FTP solution.


For your help, i am just providing you my ready made extension, Which is uploaded at Open Cart and it is a paid extension there. You can see my extension here. Description of this extension or module is given below -


REQUIREMENTS:

=============

Opencart Versions 1.5.5.x or 1.5.6.x


vQmod Versions > or = 2.3.2 (optional)


vQmod not required if you manually add code to javascript folder and carousel.tpl files.


Screen Shot :-


1392643246.CirculerSlider-500x500


WHAT DOES IT DO:

================

This will display the front slide images in a circular way.Today we want to share a simple circular content carousel with you. The idea is to have some content boxes that we can slide infinitely (circular). When clicking on the “Next Button” link, the respective item moves to the left and a content area will slide out. Now we can navigate through the carousel where each step will reveal the next or previous content box with its expanded content. Clicking on the closing cross will slide the expanded content area back in and animate the item to its original position.


LICENSE:

========

This is a Paid mod made by Lokesh Gupta and can only be used for personal use.

You can modify it as you like as long as all references to “bslgupt” are left intact.

You can not sell this mod but you can give it away for free as long as the archive and all references to bslgupt are left intact. You can see the Demo at opencart.howtowhatis.net.

INSTALLATION:

=============

Requires VQmod installed!!!


[wpdm_file id=3 template="facebook drop-shadow raised" ]


Simply upload the contents of upload Folder to your server root directory and you’re done!


2. Do that manually

If you don’t want to use VQmod then don’t worry, you can do that manually, Procedure is given below-


1.)Just find the catalog\view\theme\default\template\module\carousel.tpl and press Ctrl+A.

2.)then paste the following code


<script type="text/javascript" src="catalog/view/javascript/jquery/nivo-slider/slidefeatured.js"></script>
<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/nivo-slider/slidefeatured.css" />
<div align="center" id="carousel<?php echo $module; ?>" class="jcarousel">

<div align="center" id="slidefeatured">
<?php foreach ($banners as $banner) ?>

<a href="<?php echo $banner['link']; ?>"><img class="slidefeatured" src="<?php echo $banner['image']; ?>" title="<?php echo $banner['title']; ?>" /></a>
<?php ?>
<div id="slidefeaturedbuttonleft" class="slidefeaturedbuttonleft"></div>
<div id="slidefeaturedbuttonright" class="slidefeaturedbuttonright"></div>
<p id="slidefeatured-title"></p>
<p id="slidefeatured-alt"></p>

</div>
</div>
<script type="text/javascript">
$(document).ready(function()
$("#slidefeatured").SlideFeatured(
reflHeight: 0,
reflGap:1,
buttonLeft: $('#slidefeaturedbuttonleft'),
buttonRight: $('#slidefeaturedbuttonright'),
yRadius: 20,
xPos: 480,
yPos: 50,
speed:0.15,
autoRotate: 'left',
titleBox: $('#slidefeatured-title'),
altBox: $('#slidefeatured-alt'),
autoRotateDelay: 2500
);
$("#slidefeatured").fadeIn(3000);
);
</script>
<script type="text/javascript"><!--
$('#carousel<?php echo $module; ?> ul').jcarousel(
vertical: false,
visible: <?php echo $limit; ?>,
scroll: <?php echo $scroll; ?>,
itemFallbackDimension: 90
);
//--></script>

 


3.)And then find catalog\view\javascript and paste whole Folder into this folder.


4.)Make sure ALWAYS make a backup of your site before applying new mods etc. Better to be safe than sorry.


5.)That is all. Thank you for downloading and using this mod. If you like this mod please provide a star rating for it.



How to create opencart Extension or Module with tools

No comments:

Post a Comment