Create new module “HelloWorld” – in Magento

Do you want to create a new page in Magento ? or Do you want to create a new module in Magento ? If yes, Then ok, just spend 10 minutes and follow below steps.

Objectives: I will create a new page in Magento whose output will be “Hello World ! I am a Magento Guy..”.

Target: Create a new module called “HelloWorld”

Step 1: Module Declaration

Create app/etc/modules/M4U_HelloWorld.xml and write below code

<?xml version="1.0"?>
<config>
         <modules>
                <M4U_HelloWorld>
                        <active>true</active>
                        <codePool>local</codePool>
                </M4U_HelloWorld>
         </modules>
</config>

Step 2: Module Configuration

a. Create a controller class app/code/local/M4U/HelloWorld/controllers/IndexController.php

class M4U_HelloWorld_IndexController extends Mage_Core_Controller_Front_Action
{
    public function indexAction()
    {
     $this->loadLayout(array('default'));
     $this->renderLayout();
    }
}

b. Create a Block class app/code/local/M4U/HelloWorld/Block/HelloWorld.php

class M4U_HelloWorld_Block_HelloWorld extends Mage_Core_Block_Template
{
  // necessary methods
}

c. create configuration xml in app/code/local/M4U/HelloWorld/etc/config.xml

<?xml version="1.0"?>
<config>
	<global>
		<modules>
                <m4u_helloworld>
                        <version>0.1.0</version>
                </m4u_helloworld>
        </modules>
	<blocks>
            <helloworld>
                <rewrite>
		 <helloworld>M4U_HelloWorld_Block_HelloWorld</helloworld>
		</rewrite>
            </helloworld>
	 </blocks>

        </global>
	   <frontend>
                <routers>
                        <helloworld>
                                <use>standard</use>
                                <args>
                                      <module>M4U_HelloWorld</module>
                                      <frontName>helloworld</frontName>
                                </args>
                        </helloworld>
                </routers>
		<layout>
			<updates>
				<helloworld>
		   		      <file>helloworld.xml</file>
				</helloworld>
			</updates>
       		</layout>
        </frontend>
</config>

Define Frontend Template :

1. Define page layout in app/design/frontend/M4U/default/layout/helloworld.xml

N.B: Use default instead of M4U as template location if you use default design packages. Means create file in app/design/frontend/default/default/layout/helloworld.xml

<?xml version="1.0"?>

	<layout version="0.1.0">

		<helloworld_index_index>
			<reference name="root">
				<action method="setTemplate"><template>page/1column.phtml</template></action>
       	 	</reference>
			<reference name="content">
            	<block type="helloworld/helloworld" name="hello" template="helloworld/helloworld.phtml"/>
        	</reference>
		</helloworld_index_index>

	</layout>

2. Create template file app/design/frontend/M4U/default/template/helloworld/helloworld.phtml and write down

N.B: Use default instead of M4U as template location if you use default design packages. Means create file in app/design/frontend/default/default/template/helloworld/helloworld.phtml

Hello World ! I am a Magento Guy..

Hey, new module is ready to run and hit browser with url http://127.0.0.1/projectname/index.php/helloworld/

and see result.

That’s it……..

Is it easy or not ? what you think ?

Coder, Please at first try yourself.

Ohh.., Still are you facing problem ? Lets download full module source code from left panel “BOX” section or let me know.

Note: I have upgraded HelloWorld module source code of BOX widget. So it will resolve the problem which was faced by some guys.

Create a new module in magento

When you need to add new functionality or want to edit existing magento class in both case you should create a new module. Suppose, you want to add “User Credit” system then you need to create a new UserCredit module in magento. And if you want to edit/update customer functionality  then you should follow magento override rules. To override existing Customer module you should create another new customer  module name M4U_Customer in local pool. In this case you need to use magento rewrite rules. When you go to add or edit something in magento,  each time you can be done as separate module or few methods can be combined in same module if they share functionality or could be used together.

Let’s create a module :

Module Declaration:
Create app/etc/modules/M4U_NewModule.xml and write below code

<?xml version="1.0"?>
<config>
         <modules>
<!-- declare CompanyName_NewModule module -->
           <M4U_NewModule>
<!-- this is an active module -->
                  <active>true</active>
<!-- this module will be located in app/code/local code pool -->
                  <codePool>local</codePool>
<!-- specify dependencies for correct module loading order -->
                  <depends>
                             <Mage_ExistingModule />
                  </depends>
<!-- declare module's version information for database updates -->
                  <version>0.1.0</version>
           </M4U_NewModule>
	</modules>
</config>

Here is example of create new M4U_customer module to override existing Mage_Customer module and M4U_Credit module to create new credit module.

<config>
    <modules>
        <M4U_Customer>
           <active>true</active>
           <codePool>local</codePool>
        </M4U_Customer>
        <M4U_Credit>
           <active>true</active>
           <codePool>local</codePool>
        </M4U_Credit>
    </modules>
</config>

Our new module will be called NewModule.

Replace all instances of ‘NewModule’ with name of your module and ‘newmodule’ with simplified code, that contains only alphanumeric characters and underscore.

To make this tutorial most concise, it’s implied that mentioned folders will be created when needed.

Module Configuration:

Create Model, Helper, coltrollers, Block, sql and etc folder under  app/code/local/M4U/NewModule/ and configure app/code/local/M4U/NewModule/etc/config.xml like below:

<?xml version="1.0"?>
   <config>
       <modules>
           <M4U_NewModule>
                 <version>0.1.0</version>
           </M4U_NewModule>
       </modules>

<!-- define Front end controller and template  -->
       <frontend>
<!-- define Front end controller  -->
           <routers>
               <newmodule>
                   <use>standard</use>
                   <args>
                          <module>M4U_NewModule</module>
                          <frontName>newmodule</frontName>
                   </args>
               </newmodule>
           </routers>
<!-- define Front end template xml -->
           <layout>
               <updates>
                    <newmodule>
                         <file>newmodule.xml</file>
                    </newmodule>
                </updates>
              </layout>
           </frontend>   

<!-- define blocks, models, helpers in global area -->
            <global>
               <models>
                  <newmodule>
                         <class>M4U_NewModule_Model</class>
                  </newmodule>
               </models>
               <blocks>
                  <newmodule>
                          <class>M4U_NewModule_Block</class>
                  </newmodule>
               </blocks>
               <helpers>
                  <newmodule>
                          <class>M4U_NewModule_Helper</class>
                  </newmodule>
               </helpers>

<!-- declare resource setup for new module -->
               <resources>
                    <newmodule_setup>
<!-- specify that this resource is a setup resource and used for upgrades -->
                       <setup>
<!-- which module to look for install/upgrade files in -->
                           <module>M4U_NewModule</module>
                       </setup>
<!-- specify database connection for this resource -->
                       <connection>
<!-- do not create new connection, use predefined core setup connection -->
                           <use>core_setup</use>
                       </connection>
                    </newmodule_setup>
                    <newmodule_write>
                         <connection>
                              <use>core_write</use>
                         </connection>
                    </newmodule_write>
                    <newmodule_read>
                         <connection>
                               <use>core_read</use>
                         </connection>
                    </newmodule_read>
                </resources>
           </global>
      </config>

Adapter Class:
To obtain module functionality you can write necessary method in various classes as magento convention.
1. Create necessary model class in app/code/local/M4U/NewModule/Model/
2. Create Block in app/code/local/M4U/NewModule/Block/
3. Create Helper in app/code/local/M4U/NewModule/Helper/
4. Place necessary updated database sql file in app/code/local/M4U/NewModule/sql/

Frontend Template Define:

1. Define page layout in app/design/frontend/M4U/default/layout/NewModule.xml

<?xml version="1.0"?>
   <layout version="0.1.0">
     <newmodule_index_usercredit>
        <reference name="root">
            <action method="setTemplate"><template>page/1column.phtml</template></action>
        </reference>
        <update handle="customer_account"/>
        <reference name="content">
            <block type="newmodule/blockClassName" name="usercredit" template="newmodule/usercredit.phtml"/>
        </reference>
     </newmodule_index_usercredit>
</layout>

2. Create template file app/design/frontend/M4U/default/template/newmodule/usercredit.phtml

Troubleshooting

• Dont put your module in /Mage. It belongs in app/code/community/ or app/code/local/
• Make sure your module’s first letter is capitlized. newmodule apparently will not work, it must start with a capital letter Newmodule.
• If your module is not showing in configuration>advanced then check your config.xml
• Make sure you clear the cache.

In this post i described general module customization theory of Magento. For more clarification you can see next post  “write HelloWord module” in this blog.