Magento Development Notes 3_PHP Tutorial

In this section, we focus on Layouts and Blocks in View.

Unlike other mainstream PHPMVC architectures, magento's ActionController does not pass data objects to the view, nor does it set properties in the View object. View obtains the information it needs through system modules.

The result of this design is that View is divided into Blocks and Templates. Blocks are PHP objects, and Templates are a mixture of PHP code and HTML (it can also be considered that PHP is used as a template language). Each Block is bound to a Template file. In a Phtml file, the PHP keyword $this will contain a reference to the Block corresponding to the Template.

Here is a quick example. View the template file app/design/frontend/base/default/template/catalog/product/list.phtml

You will see the following code

getLoadedProductCollection() ?>

count()): ?>

__("There are no products matching the selection.")?>

The getLoadedProudctController can be found in the corresponding block file

app/code/core/Mage/Catalog/Block/Product/List.php

public functiongetLoadedProductCollection()

{

return$this->_getProductCollection();

}

The _getProductCollection will instantiate models and get the data to the corresponding template.

Embedded Block

The real power of Blocks/Templates is the getChildHtml method. This allows us to include the secondary Block/Template in the main Block/Template (in xml format)

Blocks calling Blocks will form our entire HTMLlayout. Look at an example

App/design/frotend/base/default/template/page/1column.phtml

< htmlxmlns="http://www.w3.org/1999/xhtml" xml:lang="?php echo$this->getLang() ?>" lang=" getLang()?>"> getChildHtml('head') ?> getChildHtml('content') ?> getChildHtml('before_body_end') ?>

getAbsoluteFooter() ?>

The file is not long, but each call is $this->getChildHtml(…), which will include and render other blocks. These blocks may also call other blocks.

Layout                                                          

Although Block and Template are good, you may have the following questions

1. How do I tell Magento which Block is used in the page?

2. How do we tell Magento it is initial

3. How do I tell each Block to call the following block

At this time, the Layout object is needed. The Layout object is in Xml format and defines which Blocks are included in a page and which Blocks are responsible for rendering the page.

We did the previous Hello World project directly on Action Method. This time we create a simple HTMLtemplate to serve the module.

First create a file

App/design/frontend/base/default/layout/local.xml

Then write the following content

                                     

Then create another file

app/design/frontend/base/default/template/simple_page.phtml (note that it is consistent with the template in the configuration)

Write the following content

                 

body { background-color:#f00; }

Finally, Aciton Controller is responsible for starting the layout process. Add the following two lines of code

public functionindexAction() {

//remove our previous echo

//echo'Hello Index!';

$this->loadLayout();

$this->renderLayout();

}

Clear the cache and reload the Hello World controller page. You can see that the background of the page is red, and the Html source code also corresponds to simple_page.phtml.

What happened?

Everything just seemed mysterious. Let's take a closer look at this process. First, we want to install the Layoutviewer module. This module is very similar to Configviewer.

Once installed, you can use the URL below

http://localhost/magento/helloworld/index/index?showLayout=page

This is a layout xml corresponding to the requested page. It consists of and tags. When you call the loadLaout method,

1. Generate a Layout xml

2. Instantiate the Block classes below and . Search for the tag name attribute, find the corresponding one in the global configuration file, and store it in the internal_blocks array of the Layout object.

3. If the tag contains an output attribute, its value is also added to the internal_blocks array of the Layout object.

In this way, when we call renderLayout in Action Controller, Mageno will iterate all the Blocks in the _blocks array and use its corresponding output attribute as the callback function. This is equivalent to conversion to Html, which means that the Template of the Block is the starting point of the output.

The following part involves how Block is instantiated, how Layout files are generated, and the end of output.

Block instantiation

In LayoutXml, there is a type of or which is equivalent to URI

URI will specify an address in the global configuration file. The first part of the URI is used to find the global configuration file and find the Page class name. The second part follows the first part and becomes a new class, which is then instantiated.

Take page/html as an example. First, Magento will look for the following

in the global configuration file

/global/blocks/page

Then find

                                                                                      

Mage_Page_Block

                                                                                   

This way we get the MagePageBlock class. Then, the second part of the URI is appended to it to become MagePageBlock_Html. This class will then be instantiated.

Blocks are also group classes in Magento, all sharing similar instantiation methods. This part will be introduced in detail later.

The difference between and

We talked about that both and can instantiate Block, so what is the difference between them.

First

This means that when requesting customeraccountindex, it should contain and under .

Apply what you learn

Having seen enough theory, let’s review our previous work.

                                       

This means we rewrote the root tag. The part guarantees that it will happen on every request. This may not be the effect we want.

If we visit any other page, we will also see a blank page, or a red background (like the previous helloworld page). So let's improve local.xml and make sure it is only used for the helloworld page. Modified as follows

                                       

Clear the cache and your other pages should be restored at this time.

Then apply to googbye Aciton Method

public function goodbyeAction() { $this->loadLayout(); $this->renderLayout(); }

Load http://localhost/magento/helloworld/index/goodbye

at this time

You will find that it is still a blank page. At this time we need to add an actionname to local.xml, the content is as follows

Clear the cache. At this time, the following two pages will have the same effect.

http://localhost/magento/helloworld/index/index

http://localhost/magento/helloworld/index/goodbye

Start output and getChildHtml

In the standard configuration, the output starts with the Block named root (this is the characteristic of the output). We have rewritten the root template template="simple_page.phtml"

The template will be obtained from the main directory of the current or base theme, such as

app/design/frontend/base/default/template

Usually you can add templates to your own theme or the default theme

app/design/frontend/default/default/template

app/design/frontend/default/custom/template

The base directory is the last directory to be searched. If magento cannot find it under other themes, it will return to the base directory. However, as mentioned before, you don't want to add to such directories because magento updates will overwrite them.

Add content block

Red Tragedy is boring. So let's add some content to the page. Change in local.xml as follows

 

I added two embedded Blocks in the root. Magento will distribute it and display a page for customer registration. To embed this Block in the root, we need to explicitly call it in simple_page.html. So we use the getChildHtml method of Block, as follows

                                                                                                                                                                         

Clear Cache and reload the page. At this time we see the registration page on a red background. There is also a Block below called top.links. Add the following

                                                                                                             

                                                                                                                                                                                                            

When we reload the page, we see that Links are rendered, but top.links does not have any rendering. This is because we did not add it in local.xml. In Layout, getChildHtml can only contain displayed Blocks as child blocks. This allows Magento to instantiate the blocks it wants, and also allows us to set different templates for the Block based on the display content

We can add Block to top.links in local.xml

                   

 

Clear the cache at this time and you can see the effect of the top.links module

http://www.bkjia.com/PHPjc/477872.htmlwww.bkjia.comtruehttp: //www.bkjia.com/PHPjc/477872.htmlTechArticleLet’s focus on Layouts and Blocks in View in this section. Unlike other mainstream PHPMVC architectures, magento's ActionController does not pass data objects to views, nor does it set View objects...