Mageguru - Magento Custom Module Development - PowerPoint PPT Presentation

About This Presentation
Title:

Mageguru - Magento Custom Module Development

Description:

Step-By-Step Guide for Magento Module Development. Hire dedicated magento 2 developers from mageguru with 5+ years experience, starting at just $18/hr to render highly robust, scalable and high-performance magento 2 compliment your business requisites. – PowerPoint PPT presentation

Number of Views:142

less

Transcript and Presenter's Notes

Title: Mageguru - Magento Custom Module Development


1
Mageguru - Magento development company
http//mageguru.co/
2
Step-by-Step Guide for Magento Module Development
3
Magento is leading the Ecommerce realm and one of
the core reasons behind it is the vast community
of Magento Developers. Magento community edition
is released with all the basic required features
to set up a working e-commerce store for any
business. But, what if you want to build your
own custom module or extension in magento? What
are the basic necessary steps to be followed by
the developer to create a working magento module,
both on the front end area as well as in the
admin area? In this article, step by step, we
are going to create our first custom module in
magento. Here I assume that, you have already
completed the installation of the magento,
caching and compilation is turned off and have
basic knowledge of the magento modules directory
structure and file system.
4
Before we start with the actual magento module
development, lets have a birds eye view on
typical magento directory structure webroot
magento project root directory app
contains code pools, design, configuration,
localization and Mage.php files code
contains the code files community third
party modules core magento core modules
local local modules design contains modules
templates and layout files adminhtml
contains the templates and layout of admin
area frontend contains the templates and
layout of front area install contains
installation files
5
etc contains the system and modules
configuration files local.xml config.xml
modules module configuration files locale
contains the localization files Mage.php
main entry point of magento framework js
javascript library files lib external
libraries include varien, zend framework,
etc. media contains product, cms images,
etc skin contains the css and js file based
on the theme var contains the system
generated directories like cache, report,
sessions etc cron.sh cron to make task
automatically index.php main entry point for
php application
6
  • Like several other popular PHP frameworks,
    magento also follows the MVC Model View
    Controller pattern structure for handling the
    requests that are coming inwards. But the major
    point which segregates it from others is the
    module configuration and request handling using
    the layout and config xml files.
  • Here I am going to create a simple HelloWorld
    module with simple page on front side and menu
    and page in admin side too so folks, lets get
    started.
  • The first question that comes to our mind is
    where to put our modules directories and files
    we have three choices a) in the community
    directory b) in the core directory c) in the
    local directory, all three are located under the
    app directory. In magento these are called code
    pools.
  • Lets have a quick overview of the code pools,
  • Core The core directory contains the core
    modules which come with magento community edition
    release. My advice is to never make direct
    changes into any of the files in this directory,
    because when its time to upgrade magento to a
    newer version, all the changes you made will
    disappear.

7
  • Community The community code pool contains the
    modules from third party developers either
    downloaded from the magento connect store or
    installed manually. You should place modules code
    in this directory if you are planning to upload
    the module to magento connect store.
  • Local We put all our projects specific modules
    into the local directory, create one if it is not
    already present in the code directory.
  • So, for our HelloWorld module I am going to
    create files and directories under the local code
    pool. You can use the community code pool too for
    this purpose. But before that, lets see which
    are the major components of a simple magento
    module development.
  • Magento module comprises of the following parts

8
(No Transcript)
9
  • Block Block files are used to fetch the data
    and display it on the template files.
  • Model The model files contains the business
    logic
  • Controllers Controllers handles the incoming
    request and renders the pages according to the
    routes defined in the layout files.
  • Helper Helper files, as the name suggest
    contains, the common code required in the whole
    module like (validations, image processing,
    etc.).
  • Etc etc directory contains the module
    configuration files which are in xml format.
    Basically there are two main files. config.xml
    and system.xml.
  • Sql sql directory contains the database query
    files which are in need for that module.
  • With this a module in magento should also follow
    the standard Naming Conventions, which is like
    Companyname_Modulename as in our case it will be
    Multidots_HelloWorld.
  • So, lets do it
  • Step 1 Go to the app/etc/modules directory and
    create the Multidots_HelloWorld.xml file and
    paste the below code in the file

10
lt?xml version"1.0"?gt ltconfiggt ltmodulesgt
ltMultidots_HelloWorldgt
ltactivegttruelt/activegt ltcodePoolgtlocallt/co
dePoolgt lt/Multidots_HelloWorldgt
lt/modulesgt lt/configgt
11
This XML file tells magento that our module is
placed under local code pool and its status is
active. You can verify the status of the module
in magento admin panel from System gtgt
Configuration. From the left sidebar Under the
Advanced section click on the Advanced tab, click
on Disable Modules Output section to expand it,
search for the Multidots_HelloWorld module. If
the module is not listed here, please check the
Multidots_HelloWorld.xml file or clear the cache
from System gtgt Cache Management. If there isnt
any problem, then you can see the module enabled
see the below screenshot
12
(No Transcript)
13
Step 2 Now as our module is enabled on the
magento site, next we will start creating the
required files and directories one by
one. Firstly, under the local code pool, you
need to create the directory with name Multidots,
under that create directory HelloWorld. It will
be like /webroot/app/code/local/Multidots/HelloWor
ld
14
Step 3 Next we will create etc directory under
the app/code/local/Multidots/HelloWorld and
create XML file with name config.xml under the
etc directory. This file will tell magento
everything about the structure of our module. Put
the below code in the config.xml file lt?xml
version"1.0"?gt ltconfiggt ltmodulesgt
ltMultidots_HelloWorldgt ltversiongt0.1.0lt/versi
ongt lt/Multidots_HelloWorldgt lt/modulesgt
ltfrontendgt ltroutersgt lthelloworldgt
ltusegtstandardlt/usegt ltargsgt
ltmodulegtMultidots_HelloWorldlt/modulegt
ltfrontNamegthelloworldlt/frontNamegt
lt/argsgt lt/helloworldgt
15
ltfrontendgt ltroutersgt lthelloworldgt
ltusegtstandardlt/usegt ltargsgt
ltmodulegtMultidots_HelloWorldlt/modulegt
ltfrontNamegthelloworldlt/frontNamegt
lt/argsgt lt/helloworldgt lt/routersgt
lt/frontendgt ltadmingt ltroutersgt lthelloworldgt
ltusegtadminlt/usegt ltargsgt
ltmodulegtMultidots_HelloWorldlt/modulegt
ltfrontNamegtadmin_helloworldlt/frontNamegt
lt/argsgt lt/helloworldgt lt/routersgt lt/admingt lt/
configgt
16
Lets understand the purpose behind each tag
used in this file, ltconfiggt/configgt is main
configuration tag which contains all other
tags. Next one is ltmodulesgt/modulesgt tag, in
which we have to put our module tag which will be
like ltCompanyname_ModuleNamegt/Companyname_ModuleNa
megt and the version of the module in the
ltversiongt/versiongt tag. the module upgradation
and versioning is managed on the value in this
tag. Under the ltfrontendgt/frontendgt tag, there
is one element ltroutersgt/routersgt, and it
contains the lthelloworldgt/helloworldgt tag which
identifies our module in the magento system.
ltusegt/usegt will tell magento which router we are
using, it can be standard, admin or default.
ltargsgt tag contains the information about our
module and the value in the ltfrontNamegt tag will
be used to access our module on frontend. In our
case it will be https//website.com/index.php/hell
oworld/ There is ltadmingt tag which also contains
the same tags we have used in the ltfrontendgt tag,
which is used for the admin configuration of our
module.
17
Step 4 Till now we have told magento about our
module, now lets do some action, in this step we
are going to create a controller file. Head to
/webroot/app/code/local/Multidots/HelloWorld/contr
ollers directory.
18
-Create IndexController.php file in the
controllers directory and put the below code
snippet in the file. lt?php class
Multidots_HelloWorld_IndexController extends
Mage_Core_Controller_Front_Action /
Index action _at_access public
_at_return void / public function
indexAction() echo "Huhh...., I knew you
can do it!!!n" echo "Let's do it in proper
way, you konow... ) D P" ?gt
19
-Now type the URL https//website.com/index.php/he
lloworld/ in your browser and see the magic.
Very easy, wasnt it ?? Here we have created our
controller file which inherits its code from the
core magento Class Mage_Core_Controller_Front_Acti
on, it is the base front controller file. -By
when we type the module name after the index.php
in the browser it will call the Index Action of
the IndexController, that means
https//website.com/index.php/helloword/ is
similar to https//website.com/index.php/helloworl
d/index/index/. -To be more confident lets
create another action. Add the below code after
the index action in the IndexController.php file.
20
/ Done it again _at_access public _at_return
void / public function doneintagainAction()
echo "done it again....!!!!" -Now, type the
URL https//website.com/index.php/helloworld/index
/doneintagain/, we have created another action
successfully. You can add as many action you want
in the controller file. This is it for the
frontend part, now lets see how to create and
access the admin part of our module.
21
Step 5 I am sure you have noticed the below
configuration portion in the config.xml file we
created in the Step 3 of this tutorial ltadmingt
ltroutersgt lthelloworldgt
ltusegtadminlt/usegt ltargsgt
ltmodulegtMultidots_HelloWorldlt/modulegt
ltfrontNamegtadmin_helloworldlt/frontNamegt
lt/argsgt lt/helloworldgt lt/routersgt lt/admingt -T
his portion in the config.xml file tells magento
the name of the router we are going to use in the
admin side, which is described as
ltfrontNamegtadmin_hellowordlt/frontNamegt. -Now,
head to the path /webroot/app/code/local/Multidots
/HelloWorld/controllers and create the Adminhtml
directory.
22
ltglobalgt lthelpersgt lthelloworldgt
ltclassgtMultidots_HelloWorld_Helperlt/classgt
lt/helloworldgt lt/helpersgt lt/globalgt
23
ltadminhtmlgt ltmenugt lthelloworld
module"helloworld"gt lttitlegtHelloWorldlt/title
gt ltsort_ordergt100lt/sort_ordergt
ltchildrengt lthelloworld module"helloworld"gt
lttitlegtHello Worldlt/titlegt
ltsort_ordergt0lt/sort_ordergt
ltactiongtadmin_helloworld/adminhtml_indexlt/actiongt
lt/helloworldgt lt/childrengt
lt/helloworldgt lt/menugt lt/adminhtmlgt
24
-The above XML part in the config.xml file is
required for the admin part. The configuration in
the ltglobalgt tag will be available for both the
frontend and the admin panel. -lthelpersgt tag
specifies the path of the helper class in our
module. Step 6 Head to the path
/webroot/app/code/local/Multidots/HelloWorld/.
Create a new Helper directory there, and in the
Helper directory create Data.php file, in the
Data.php file add the below code lt?php class
Multidots_HelloWorld_Helper_Data extends
Mage_Core_Helper_Abstract The helper class
is used to render the menu in the admin panel,
which is generated by the XML code in the tags
ltadminhtmlgt in the config.xml file
25
Step 7 In the Adminhtml directory create
IndexController.php file and put the below code
snippet in that file. lt?php class
Multidots_HelloWorld_Adminhtml_IndexController
extends Mage_Adminhtml_Controller_Action
/ Admin controller index action
_at_access public _at_return void / public
function indexAction() echo 'hello world in
the admin side..!!!'. '' -Here we have
created a controller file which extends the core
magento admin Controller file and created an
index action same as we had done in the front end
part.
26
Step 8 Now log into your admin panel on the main
navigation bar. You will see the new menu
Helloworld
click on the Hello World menu and you will see
the message on your monitor screen.
Thats it guys, you have done it ?? Its all
simple and basic stuff relating to magento. There
is a lot to come ahead. Stay tuned till then.
27
Follow Us on Social Media
  • https//plus.google.com/117313927787502991442
  • https//www.facebook.com/MageGuru.co/
  • https//twitter.com/mageguruco
  • https//www.pinterest.com/mageguru/
  • https//www.linkedin.com/company/mageguru/
  • https//www.youtube.com/channel/UCIPw4CAb47uqsA7nM
    fsJKgQ

28
(No Transcript)
Write a Comment
User Comments (0)
About PowerShow.com