在magento布局中的选定页面中包含JS和CSS

时间:2011-06-29 15:18:05

标签: php magento

我需要帮助优化我的布局xml并摆脱重复。 在我的模块的一些页面中,我包含了js文件,并且我在所有这些文件中都包含了css。 这是我的模块布局xml的内容:

<layout version="0.1.0">
<catalog_product_view>
    <reference name="head">
        <!-- jQuery(compatibility mode) and jQuery UI -->
        <action method="addJs"><script>jquery/jquery-1.6.1.js</script></action>
        <action method="addJs"><script>jquery/jquery-ui-1.8.13.js</script></action>
        <action method="addCss"><script>css/ui_themes.1.8.13/smoothness/jquery-ui.css</script></action>
        <!-- Other Libraries -->
        <action method="addJs"><script>myreviews/quickpager.jquery.js</script></action>
        <!-- Custom Libraries -->
        <action method="addJs"><script>myreviews/functions.js</script></action>
        <action method="addJs"><script>myreviews/popup.js</script></action>
        <action method="addCss"><script>css/myreviews.css</script></action>
    </reference>
    <reference name="content">
        <block type="myreviews/view" name="myreviews.view" template="myreviews/view.phtml" />
    </reference>
</catalog_product_view>
<myreviews_form_additional>
    <reference name="head">
        <!-- jQuery(compatibility mode) and jQuery UI -->
        <action method="addJs"><script>jquery/jquery-1.6.1.js</script></action>
        <action method="addJs"><script>jquery/jquery-ui-1.8.13.js</script></action>
        <!-- Custom Libraries -->
        <action method="addCss"><script>css/myreviews.css</script></action>
    </reference>
    <reference name="content">
        <block type="myreviews/form" name="myreviews.form_additional" template="myreviews/form_additional.phtml" />
    </reference>
</myreviews_form_additional>
<myreviews_form_confirm>
    <reference name="head">
        <action method="addCss"><script>css/myreviews.css</script></action>
    </reference>
    <reference name="content">
        <block type="myreviews/form" name="myreviews.form_confirm" template="myreviews/form_confirm.phtml" />
    </reference>
</myreviews_form_confirm>

这一切都有效,但有没有办法不重复头部参考的同样和平? 也许有一种方法可以编写所有js和css包含是单独的句柄并让它在我的页面上执行吗?

感谢。

1 个答案:

答案 0 :(得分:6)

是的,手柄是要走的路。一个例子:

在布局文件中的某处定义:

...
<myreviews_form_base translate="label">
    <label>Base layout handle for MyReviews</label>
    <reference name="head">
       <action method="addJs"><script>jquery/jquery-1.6.1.js</script></action>
       <action method="addJs"><script>jquery/jquery-ui-1.8.13.js</script></action>
       <action method="addCss"><script>css/myreviews.css</script></action>
   </reference>
</myreviews_form_base>

然后你可以在适当的地方使用这个句柄:

...
<catalog_product_view>
    <update handle="myreviews_form_base"/>
    ...other stuff...
</catalog_product_view>

这会将myreviews_form_base句柄中包含的所有操作应用于catalog_product_view句柄。