1

I trying to add custom js & css only for all category pages.

I create a local.xml file at app/design/frontend/package/theme/layout/local.xml & add this code inside it.

< ?xml version="1.0"?>
<layout version="0.1.0">
     <catalog_category_default>
         <reference name="head">
             <action method="addItem">
                  <type>skin_js</type><name>js/myjavascript.js</name>
             </action>
             <action method="addItem">
                   <type>skin_css</type><name>css/mycss.css</name>
             </action>
         </reference>            
     </catalog_category_default>
</layout>

But I don't get that files in head section. So my question is how to add custom css & js files for all category pages ?

3
  • and what is the question? Commented Nov 13, 2014 at 7:55
  • you are not able to add it ? Commented Nov 13, 2014 at 7:55
  • you can try the answers and check which is posted Commented Nov 13, 2014 at 8:07

3 Answers 3

10

The category pages can use 2 layout handles depending on the 'is_anchor' flag of the category.
catalog_category_default is used when is_anchor is no and catalog_category_layered is used when is_anchor is yes.
But there is one layout handle that is loaded, but magento does not use it in it's files.
<catalog_category_view>.

So you can try with this code:

<?xml version="1.0"?>
<layout version="0.1.0">
    <catalog_category_view>
        <reference name="head">
            <action method="addItem">
                <type>skin_js</type><name>js/myjavascript.js</name>
            </action>
            <action method="addItem">
                <type>skin_css</type><name>css/mycss.css</name>
            </action>
         </reference>            
     </catalog_category_view>
</layout>
2
  • +1 for that special catalog_category_view layout handle. I will definitely try that layout handle when a situation comes. :-) Commented Nov 13, 2014 at 8:14
  • I followed your answer, my js is inside skin/frontemd/ucs_personalizaion/js/person.js, but in page source magento looks the js inside base/default.. directory, can you help me? Commented Jun 15, 2015 at 8:36
2

try this

<catalog_category_layered>
    <reference name="head">
        <action method="addItem">
            <type>skin_js</type> 
            <name>js/myjavascript.js</name> 
        </action>
        <action method="addItem">
            <type>skin_css</type> 
            <file>css/mycss.css</file> 
        </action>
    </reference>
</catalog_category_layered>
0

To add CSS file follow the below steps:

Open File
app\design\frontend\rwd\default\layout\page.xml
Add the below tag for css:
<action method="addCss"><stylesheet>css/[filename].css</stylesheet></action>

Just below the last method=”addCss” add the above line.
Now open,
skin\frontend\rwd\default\css\[filename].css

Start writing your css code in this file.

To add JS file follow the below steps.

Open File
app\design\frontend\rwd\default\layout\page.xml
Add the below tag
<action method="addItem"><type>skin_js</type><name>js/[filename].js</name></action>

Just below the js include tags similar to the above line.
Now open,
skin\frontend\rwd\default\js\[filename].js

Start writing your js code in this file

Question is same as #226981

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.