Writing a Magento Extension

Magento Extensions Development Tips and Tricks

  • Writing a Magento Extension - part2

    Posted on August 9, 2011 by admin

    On this part, we will make the text "Hello World" appear inside the Magento design.

    For this, go to app/code/local/Engineering/Helloworld/controllers/IndexController.php and change its code to following:

    <?php class Engineering_Helloworld_IndexController extends Mage_Core_Controller_Front_Action
    {
    	public function indexAction()
    	{
    	    $this->loadLayout();
                $this->renderLayout();
    	}
    }

    A short explanation:
    When calling to

    $this->loadLayout();

    Magento will go to "app/design/myinterface/mytheme/layout" (on a fresh Magento installation, it actually "app/design/base/default/layout") reads all the XML files and searches there for a tag named layout and loads the found data to "core/layout" object.
    Now, when calling to

    $this->renderLayout();

    the layout will be rendered.

    Now lets go to www.mysite.com/helloworld - we will see some empty standard Magento design. It's because only tags get loaded.

    Now go to app/code/local/Engineering/Helloworld/etc/config.xml and add some change to it:

    <?xml version="1.0"?>
    <config>
     <modules>
      <Engineering_Helloworld>
       <version>0.1.0</version>
      </Engineering_Helloworld>
     </modules>
     <frontend>
      <routers>
       <engineering_helloworld>
        <use>standard</use>
        <args>
         <module>Engineering_Helloworld</module>
         <frontName>helloworld</frontName>
        </args>
       </engineering_helloworld>
      </routers>
      <layout>
       <updates>
        <engineering_helloworld>
         <file>helloworld.xml</file>
        </engineering_helloworld>
      </updates>
      </layout>
     </frontend>
    </config>

    This tells magento to regard the file named helloworld.xml as another layout file. Now create the helloworld.xml at:
    app/design/frontend/default/default/layout/helloworld.xml
    Type in the following:

    <?xml version="1.0"?>
    <layout version="0.1.0">
     <engineering_helloworld_index_index>
      <reference name="content">
       <block type="core/template" name="helloworld.text"
       template="engineering/helloworld/sayhello.phtml"/>
      </reference>
     </engineering_helloworld_index_index>
    </layout>

    Because the URL is www.mysite.com/helloworld/index/index magento will load the content of <helloworld_index_index> tag to the layout object.  Afterwards, the

    $this->renderLayout();

    will put the block named "helloworld.text" to the block named "content",  load the block class "core/template" (Mage_Core_Block_Template) and template "engineering/helloworld/sayhello.phtml" (app/design/frontend/myinterface/mytheme/engineering/helloworld/sayhello.phtml)  for this block.

    Now, create "sayhello.phtml" at
    app/design/frontend/default/default/template/engineering/helloworld/sayhello.phtml
    type there just

    Hello World

    Now, go to www.mysite.com/admin/helloworld - you should see the text "Hello world" inside magento design.


    This post was posted in Writing a Magento Extension and was tagged with magento extension, hello world, magento module

  • Writing a Magento Extension - part1

    Posted on August 5, 2011 by admin

    In this tutorial we will create a Magento extension step by step. our extension will print "Hello World" to the screen.

    Go to "app/code/local" and create a new folder. name it "Packagename" - the "Packagename" is likely to be your company name - this folder will serve all the extensions that will be made by your company. I'll call it "Engineering".

    Inside the "Packagename" folder, create another folder named "Modulename" - the "Modulename" is the name of your module - I'll name it "Helloworld". now we should have the following path:

    app/code/local/Engineering/Helloworld

    Now you have to tell Magento about your extension, so create a file named "Engineering_Helloworld.xml" in the following path:

    app/etc/modules/Engineering_Helloworld.xml

    type in the following:

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

    Magento is a configuration-set MVC system. that means, if you want the URL

    www.mysite.com/helloworld/index/index

    will display "Hello World", you need to tell Magento about this. Create a file named "config.xml" in the following path (create the etc folder, also):

    app/code/local/Engineering/Helloworld/etc/config.xml

    type in the following:

    <?xml version="1.0"?>
    <config>
     <modules>
      <Engineering_Helloworld>
       <version>0.1.0</version>
      </Engineering_Helloworld>
     </modules>
     <frontend>
      <routers>
       <engineering_helloworld>
        <use>standard</use>
        <args>
         <module>Engineering_Helloworld</module>
         <frontName>helloworld</frontName>
        </args>
       </engineering_helloworld>
      </routers>
     </frontend>
    </config>
    

    A short explanation about the config.xml tags:
    The <use> tag in the <router> hierarcy, tells Magento whether the <router> tag refers to admin url or the frontend url. we want the URL www.mysite.com/helloworld/index/index, and not  www.mysite.com/admin/helloworld/index/index, so that means we need the frontend. the <use> is "standard" (other options are "admin" and "default").
    The tag <engineering_helloworld> under <routers> seems to be arbitrary, but sure, there are conventions, so you need to write your full module name in lower case.
    The tag <frontName> tells Magento about the first string of your extension's URL, so the URL is:
    www.mysite.com/helloworld/index/index
    and not, for example
    www.mysite.com/byeworld/index/index
    [Note: you have to make sure that the term "helloworld" isn't already occupied by other extension or core module, otherwise the Magento's behavior will be unpredicted.]

    Now it's time to write the code for the output "Hello World":
    For us, to make the page

    www.mysite.com/helloworld/index/index

    display "Hello World", we need to create a file named "indexController.php" at:

    app/code/local/Engineering/Helloworld/controllers/IndexController.php

    and type in the following code:

    <?php
    class Engineering_Helloworld_IndexController extends Mage_Core_Controller_Front_Action
    {
        public function indexAction()
        {
        echo "Hello World";
        }
    }

    Now, go to www.mysite.com/helloworld/index/index, and you should see the desired "Hello World".
    So, actually, when you go to www.mysite.com/helloworld/index/index, Magento is looking for a front name "helloworld" through all the active module configurations. if found, it searches for indexController. if found, it's looking for
    indexAction inside that controller.
    Now try to go to www.mysite.com/helloworld - you should see the same result, this is only because when nothing mentioned after the module name, Magento looking for index/index by default.

    On the next post, we will add some design to our extension page - so don't go anywhere :-)

     

    Writing Magento Extension – part2


    This post was posted in Writing a Magento Extension and was tagged with magento extension, hello world, magento module

Items 7 to 8 of 8 total

Page:
  1. 1
  2. 2
  3. 3
Magento is a well-engineered eCommerce platform designed to help engineers develop customized eCommerce online stores. Due to lack of proper coding documentation, Engineer-ing.com was created with the sole purpose of instructing Magento developers to-be with the "how-to-do" know-how. In the event of unresolved issues, you are more than welcome to contact me for consultation. However, please do so only if you possess a Software Engineering background and you're able to specify your question.