Can I Alter Core Template Files Magento 1.9

In the first part of this series, nosotros learned the basics of Magento module development including the Magento directory structure, the custom module construction, and nosotros created a basic "Hello Earth" module in order to understand how controllers work in Magento.

In this article, we will learn how to create blocks and layouts files. Specifically, we'll wait at how layout files and blocks files work in Magento and nosotros'll await at the rendering of layout files.

Looking for a Quick Solution?

If you're looking for a quick solution, at that place's a bully drove of Magento themes and templates over at Envato Market. Information technology's a great style to speedily build up a collection of high-quality depression poly items for your project.

You lot can too become personalised help by hiring one of the Magento service providers on Envato Studio.

But, on with the tutorial! Start, we volition run across what the layout and block files are and how they are useful in rendering front-end pages in Magento, and then we will encounter how we can include them in our custom module.

What Is the Layout File?

As the name suggests, layout files are useful in rendering front pages of Magento. Layout files are XML files that reside in in app > design > frontend > your interface > your theme > layout.Here, you can see that at that place are many layout files for any given module. Each Magento module has its own layout files much similar the customer module has thecustomer.xml layout file, itemize module acceptcatalog.xml layout file etc. These layout files contain structural blocks and content blocks.

If you're wondering why Magento needs these blocks, you lot can learn more about this in the first part of the series.

Allow's Dig More Into Layout Files

Let'southward dig more than into layout files by looking at 1 case. Go to app > design > frontend > base of operations > layoutand open thecustomer.xml file. Here, all blocks are wrapped around main<layout> tag. You can meet the different <tag> which contains specific blocks.

See the beneath snippet:

<!-- New customer registration -->      <customer_account_create translate="characterization">         <label>Client Account Registration Form</label>         <!-- Mage_Customer -->         <remove name="right"/>         <remove proper noun="left"/>          <reference proper noun="root">             <action method="setTemplate"><template>page/1column.phtml</template></action>         </reference>         <reference name="content">             <cake type="customer/form_register" name="customer_form_register" template="customer/class/register.phtml">                 <block type="page/html_wrapper" proper name="customer.form.annals.fields.earlier" as="form_fields_before" translate="label">                     <label>Form Fields Earlier</label>                 </block>             </block>         </reference>     </customer_account_create>

Handle

Handles are the chief entity through which Magento identifies which block to load when a detail module is being called.<customer_account_create> is the module-specific handle. This handle is being triggered when someone opens the customer registration page.

Each handles content-nested block specific to the page. Some of layouts files contain the<default> handle. At this stage, yous may ask most the divergence between module specific-handles and default handles. In short, module-specific handles just return the blocks inside it when that module is being rendered in browser whereas default handle loads in most of the page.

<block>

Inside the handle there is the different unlike blocks which specify the template file to be render when that block is being called. Blocks are of two types:

Structurer Blocks
Content Blocks

In our layout file we are defining only the Content Blocks and then we wrap them in Southwardtructurer Blocks .For example, if someone is calling a customer registration page and we want to load it on left, right, content, or footer, we wrap that block in its corresponding structurer cake. Here, we have wrapped 2 blocks inside the "content" block which is a structurer block.

Blocks contains attributes similar following:

blazon defines the block classes in which nosotros tin can define the different functionality
proper noundefinesthe unique proper name of detail cake and so the other blocks tin can make a reference of existing block by proper name and extend information technology
before/afterwardare attributes that we can set that allow u.s.a. to define the position of our block within structurer block
templatedefines the actual phtml file name and path where our HTML and PHP code goes
actionallows us to trigger whatever action similar loading JavaScript and all by using this attribute.
asis an aspect is mainly used for structurer blocks

<reference>

The <reference> tag is use to extend the blocks that already exist. In this case, we take extended the content block and inserted our ain cake into it. You must use the correct block name that y'all want to extend.

<remove>

The <remove> tag is utilise to remove the specific block. For instance, say that on your account registration page you, don't want to display the right and left columns. In that case, then you tin can simply remove that block with the following syntax<remove proper noun="your cake name">.

Child <block>

When y'all wrap 1 block under another block, that wrapped block is chosen child block. Whenever our parent block is called by our module, the child block is automatically called.

<block type='core/template' proper noun='parent' template='parent.phtml'> <cake blazon='core/template' proper noun='child' template='child.phtml'/> </block>

Yous can telephone call child block separately too with below syntax in you template file
repeat $this->getChildHtml('child');

root <block>

Openpage.xml layout file, you lot will find the <root> block that is looks similar below

          <block type="folio/html" proper noun="root" output="toHtml" template="page/3columns.phtml">

Magento starts rendering from the root block. All other blocks are kid blocks of the root block. The root cake defines the construction of the page. Here, you can see that currently it's set to 3columns.phtml, you tin can change this to 1column.phtml, 2columns-right.phtml or 2columns-left.phtml.

Adding CSS and JavaScript to the Layout XML

For any particular page yous tin add together CSS and JavaScript files into layout tag like this:

<customer_account_create>  <reference name='head'>   <action method="addCss"><stylesheet>css/styles.css</stylesheet></activity>   <action method="addJs"><script>varien/js.js</script></action>  </reference> </customer_account_create>

Here y'all can see that we have added a CSS file and a JavaScript file inside the head of our customer account page.

What Are The Block Classes?

Block classes are apply to ascertain the functions that are specific to particular block. Block classes file are resides inapp > code > local/customs/core > your module namespace > your module name > Cake directory. These file contains the functions which we can use direct with $this keyword in block specific template file. Permit's take one example to understand the block classes.

Become to review.xml file that is resides in app > design > frontend > base > default > layout directory and discover the below line of lawmaking:

<!-- Customer account home dashboard layout -->      <customer_account_index>          <!-- Mage_Review -->         <reference name="customer_account_dashboard">             <block type="review/customer_recent" name="customer_account_dashboard_info1" as="info1" template="review/customer/recent.phtml"/>         </reference>  </customer_account_index>

Here y'all can meet the cake review/customer_recent that refer to the template recent.phtml . Go toapp > design > frontend > base > default > template > review > customer and open upcontempo.phtml .

In this file, you tin see two functions beingness called using $this keyword. They are$this->getCollection() and$this->count() .These functions are defined in their block classes filerecent.php that resides in app > lawmaking > core > Mage > review > Cake > customer directory.

Here, the cake type = "review/customer_recent" refers to theMage_Review_Block_Customer_Recent block class that is ascertain in recent.php file. Whatsoever functions you define in this class, you tin directly use it in corresponding template file with $this.

Creating Custom Module Layout and Cake Files

Lastly, we were left with custom "Hullo World" module with controller. Hither, we create the layout file of our custom module.then permit's create it.

To create the layout file, we need to first create the cake form file. Earlier we add together the course file, we need to tell our module that we are including the block files. So go to app > code > local > Chiragdodia > Mymodule > etc > config.xml and add together the beneath line of code:

<frontend> <layout>         <updates>             <mymodule>                 <file>mymodule.xml</file> <!-- Our layout file proper noun-->             </mymodule>         </updates> </layout> </frontend> <global>         <blocks>             <mymodule>                 <class>Chiragdodia_Mymodule_Block</class>             </mymodule>         </blocks> </global>

The concluding XML file contains the following lines of lawmaking:

<?xml version="1.0"?> <config>     <modules>         <Chiragdodia_Mymodule>             <version>0.1.0</version>    <!-- Version of module -->         </Chiragdodia_Mymodule>     </modules>     <frontend>         <routers>             <mymodule>                 <employ>standard</use>                 <args>                     <module>Chiragdodia_Mymodule</module>                     <frontName>mymodule</frontName>                 </args>             </mymodule>         </routers>          <layout>             <updates>                 <mymodule>                     <file>mymodule.xml</file> <!-- Our layout file name-->                 </mymodule>             </updates>          </layout>     </frontend>     <global>         <blocks>             <mymodule>                 <class>Chiragdodia_Mymodule_Block</form>             </mymodule>         </blocks>     </global> </config>

Create the Block Class File

Next, go to app > code > local > Chiragdodia > Mymodule > Block and create the file Mymodule.php that contains below lines of code

<?php class Chiragdodia_Mymodule_Block_Mymodule extends Mage_Core_Block_Template {     public function myfunction()     {         render "Hello tuts+ world";     } }

Here we take alleged the class Chiragdodia_Mymodule_Block_Mymodule that contains the function myfunction which nosotros can call straight from our layout template file.

Create the Layout XML File

Go to app > pattern > frontend > default > default > layout and create the mymodule.xml file which contains below lines of code

<?xml version="1.0"?> <layout version="0.1.0">     <mymodule_index_index>         <reference proper name="content">             <block type="mymodule/mymodule" name="mymodule" template="mymodule/mymodule.phtml" />         </reference>     </mymodule_index_index> </layout>

Create the Template File

Get toapp > blueprint > frontend > default > default > template and create the mymodule.phtml file. In this file, we will call the part myfunction that we accept alleged in our block course.

<?php     echo $this->myfunction(); ?>

If everything is right thus far, you will see the output with three columns layout by accessing the URL yoursite.com/index.php/mymodule/index.

In some Magento versions, default themes exercise non contain the layout and template directories. In that case yous can create your layout and template file in app > blueprint > frontend > base directory.

This is how layouts work in Magento. In the previous article, nosotros created the simple "Hello World" module, in this article we have created it using layout file. The Magento layout structure is footling bit difficult to understand at first, but in one case y'all begin tinkering with it, you lot will easily get the idea behind it.

In this post, I have attached the module demo files that we take created till now. Feel complimentary to annotate and enquire any questions that you may accept about this detail upshot.