How to add/include js file into Magento theme

Question

I am modifying a Magento theme. And want to add a js file into the theme /js folder. I have added the following code:

<action method="addItem"><type>skin_js</type><name>js/custom-script.js</name></action>

into the /app/design/frontend/theme-name/default/layout/page.xml and published the js file into /skin/frontend/theme-name/default/js/. But no luck. It is not showing on the page. Someone please help me to rectify this. Thanks.

Answer 1

Try adding the following to your layout .xml file within <reference name="head">

<action method="addJs">
    <script>js/custom-script.js</script>
</action>

Answer 2

Add this code in,

app/design/frontend/{your_theme}/default/template/page/html/header.phtml

<script type="text/javascript" src="<?php echo $this->getSkinUrl(); ?>js/custom-script.js"></script>

And put custom-script.js file in js folder on root.

FYI : Like this you can add any js/css file on phtml files

Answer 3

If you want to implement custom code (a .js file), please follow these steps:

• From the Admin panel, go to Design > Themes Editor.

• Click Customize under the theme you wish to add custom script to.

• Click Java Script Editor in the left panel to manage JavaScript assets.

• Click Browse Files, select the JavaScript file from your local drive, and then click Upload Files.