Wednesday, 17 July 2013

Creating your first Magento 2 Module

Here we creating a Hello world module for the Magento 2.
Prerequisite: You have a Magento 2 running at your site. .e.g. http:/localhost/magento2/

Now here is steps to create new Magento 2 Module.
Step 1: Creating module structure.
-- Go to app/code
-- Looking for code pool local. In Magento2 no separate code pool available so forget about it.
-- Now create the module structure as bellow:
app/code/Magentozend/Hello
app/code/Magentozend/Hello/etc
app/code/Magentozend/Hello/controllers
app/code/Magentozend/Hello/view
app/code/Magentozend/Hello/Block
Magento2 Structure

-- Here "Magentozend" is Namespace and "Hello" is your Module name.
-- etc directory for storing configuration files.
-- controllers directory for putting all controller files.
-- Block directory for putting block files
-- view is for putting view files of frontend as well as adminhtml

Step 2: Configuring your new Module.
-- Looking for app/etc/modules. It deprecated now. Be remain in your module only.
-- Create config.xml in the app/Magentozend/Hello/etc as below:
<?xml version="1.0"?>
<config>
    <modules>
        <Magentozend_Hello>
            <version>1.0.0.0</version>
            <active>true</active>
        </Magentozend_Hello>
    </modules>
 
    <frontend>
        <routers>
            <hello>
                <use>standard</use>
                <args>
                    <module>Magentozend_Hello</module>
                    <frontName>hello</frontName>
                </args>
            </hello>
        </routers>
<layout> <updates> <hello module="Magentozend_Hello"> <file>layout.xml</file> </hello> </updates> </layout>
  </frontend>   </config>

-- Here the section will tell magento that the module is enabled or disabled.
-- In we specify our front name for the module. By this name the module will be accessed in front.
-- under the specify the layout file for the frontend

Step 3: Creating controller for your module
-- Lets create IndexController.php at app/code/Magentozend/Hello/controllers/IndexController.php
class Magentozend_Hello_IndexController extends Mage_Core_Controller_Front_Action 
{    
  public function indexAction()
 {
   //echo 'Hello world';
      $this->loadLayout();
            $this->renderLayout();
  }
}
?>

Step 4: Creating your layout file
-- You have already added tag under the in the app/Magentozend/Hello/etc/config.xml
-- So only need to create layout.xml file at app/Magentozend/Hello/view/frontend/layout.xml
 
<layout version="0.1.0">
    <hello_index_index translate="label" type="page" parent="default">
        <label>Hello World</label>
        <reference name="root">
            <action method="setTemplate"><template>1column.phtml</template></action>
        </reference>
        <reference name="content">
            <block type="Magentozend_Hello_Block_Hello" name="hello_world" template="hello.phtml" />
        </reference>
    </hello_index_index>
</layout>

-- Block Type – the traditional shorthand method is now depreciated, we are now required to specify the entire class names of our blocks

Step 5: Creating Block File
-- As referenced in the layout.xml we need to create a block class
class Magentozend_Hello_Block_Hello extends Mage_Core_Block_Template
{

}


Step 6: Create Template view File

-- again there is no template folder in magento2.
-- Now you need to create hello.phtml as referenced in layout.xml as app/code/Magentozend/Hello/view/frontend/hello.phtml
<h1><strong>Hello World</strong></h1>
<strong>Great! Welcome to Magento 2 Layouts Views </strong>

-- Thats all. Now you can access from frontend as www.yoursite.com/hello

Hope this will help you to understand Magento 2 better.
Waiting for your comment and suggestions.


You can directly download this code here.
put this code under the app/code of your magento2 installation.

1 comment :

  1. Magento 2 is now at dev64 and is quite different from what you described here. Still, your tutorial has helped me to create my first module.

    ReplyDelete