这次继续进行magento模板制作的探讨,上一次说了.xml可以做到.phtml做不到的事情。今天说说xml和phtml是怎么配合着来生成我们的magento模版的。

本次讲解,使用magento 1.4版本,使用base中的default模板。

例子是最快速了解magento的方式了,我们来看下magento头部的搜索框,是怎么显示出来的。

 在:appdesignfrontendbasedefaultlayoutcatalogsearch.xml 中有声明定义

<default>
    <reference name=”header”>
        <block type=”core/template” name=”top.search” as=”topSearch” template=”catalogsearch/form.mini.phtml”/>
    </reference>

然后在:appdesignfrontendbasedefaulttemplatepagehtmlheader.phtml 中调用输出

<div>           
<?php echo $this->getChildHtml(‘topSearch’) ?>
</div>

我们看到在XML中有代码片段 as=”topSearch”, 然后在phtml文件中的getChildHtml()的参数就是topSearch,所以,这就是关键点。

我们要将这个搜索从模板的头部(header)移动到模板的底部(footer)怎么办呢?

那么就先将上面的XML中的<reference name=”header”> 改成<reference name=”footer”>,

然后将appdesignfrontendbasedefaulttemplatepagehtmlheader.phtml中的<?php echo $this->getChildHtml(‘topSearch’) ?>删掉将其添加到:appdesignfrontendbasedefaulttemplatepagehtmlfooter.phtml中的适当位置。

这个时候我们就发现:
<reference name=”header”> 对应的就是appdesignfrontendbasedefaulttemplatepagehtmlheader.phtml文件
<reference name=”footer”> 对应的就是appdesignfrontendbasedefaulttemplatepagehtmlfooter.phtml文件

我们看下:appdesignfrontendbasedefaultlayoutpage.xml文件中的定义这个footer和header的代码片段
<block type=”page/html_footer” name=”footer” as=”footer” template=”page/html/footer.phtml”>                 <block type=”page/html_wrapper” name=”bottom.container” as=”bottomContainer” translate=”label”>             <label>Page Footer</label>                    
<action method=”setElementClass”><value>bottom-container</value></action>
</block>                
<block type=”page/switch” name=”store_switcher” as=”store_switcher” template=”page/switch/stores.phtml”/>   <block type=”page/template_links” name=”footer_links” as=”footer_links” template=”page/template/links.phtml”/>
</block>

从这第一行代码,就很清楚得知,name=”footer”的区块引用模板文件template=”page/html/footer.phtml”。
所以这个<reference name=”footer”>就是在对footer.phtm中的getChildHtml()进行定义。
如果是初学者,读到这里还不懂,没关系。但是我们可以去照猫画虎,去总结规律。