Question

In Magento, how to add js or css file in custom two column left page using page.xml file.

I am using the following code in page.xml at line:168

<page_two_columns_left translate="label">
  <label>All Two-Column Layout Pages (Left Column)</label>  
  **<reference name="head">
    <action method="addJs"><script>sidebar_menu.js</script></action>
    </reference>**
    <reference name="root">
        <action method="setTemplate"><template>page/2columns-left.phtml</template>  </action>
        <!-- Mark root page block that template is applied -->
        <action method="setIsHandle"><applied>1</applied></action>
    </reference>
</page_two_columns_left>

I can use the js/css by putting it in 2column-left.phtml but I don’t thing it is convenient way. I want to add using xml.

Answer 1

Are the two asterisks up there actually on your code? If not, basically what you’re doing there is correct. however:

<handle>
    <reference name="head">
        <action method="addJs"><script>prototype/prototype.js</script></action> <!-- adds a js referencing to the /js directory -->
        <action method="addCss"><stylesheet>css/custom.css</stylesheet></action> <!-- adds CSS looking at the skin/ directories ( in reverse order: base/default, default/default, default/yourtheme, yourpackage/yourtheme -->
        <action method="addItem"><type>skin_js</type><name>js/custom_script.js</name><params/></action> <!-- adds a js at the skin/ directories in the same manner as the above addCss directive -->
    </reference>
<handle>

Please note that can be replaced by either default,modulename_controller_action e.g catalog_cart_index or in your case, page_two_columns_left

It is best to modify local.xml instead found inside app/design/frontend/yourpackage/yourtheme/layout/ if you have a custom skin to work with.

As much as possible, please don’t touch page.xml inside the app/design/frontend/base/default/layout/ directory.