Magento add Js to the footer

Question

I am trying to load js file in the footer of my magento. I am using this code but it give me back an error. Any help? Thanks a lot!

code used in local.xml: 

<layout>
<default>
    <reference name="footer">
        <action method="addJs"><script>js/file.js</script></action>
    </reference>
</default>
</layout>

Solution 1

Find page.xml of your theme and find the following

<block type="core/text_list" name="before_body_end" as="before_body_end" translate="label">

And insert the following code after that

<block type="page/html_head" name="jsfooter" as="jsfooter" template="page/html/jsfooter.phtml">
   <action method="addJs"><script>your_script.js</script></action>
</block>

Create the template file in app/design/frontend/[package]/[theme]/template/page/html/jsfooter.phtml and put the following:

<?php echo $this->getCssJsHtml() ?>

In your page template files “1column.phtml”, “2columns-left.phtml”, “2columns-right.phtml”, “3columns.phtml” and etc. you will need to output this block before tag:

<?php echo $this->getChildHtml('jsfooter') ?>

Solution 2

For Magento v1.6+ (need to test in older versions);

1 - create an template file in page/html/footer/extras.phtml with this content:

<?php echo $this->getCssJsHtml() ?>

2 - Add this html node to your layout xml:

<reference name="before_body_end">
<block type="page/html_head" name="extra_js" as="extraJs" after="-" template="page/html/footer/extras.phtml">
    <action method="addItem"><type>skin_js</type><name>js/jquery.min.js</name></action>
</block>

3 - That is it!

Solution 3

Referencing my answer here:
How to add Javascript files in body part (not header) through layout xml files in magento

Your best bet is to make a .phtml file with your js links and add it to your footer using this format:

<layout>
    <default>
        <reference name="footer">
            <block type="core/template" name="unique_name_here" template="path/to/js.phtml" />
        </reference>
    </default>
</layout>

For references like this, the footer will automatically load all child html blocks. Parent .phtml template files may need a getChildHtml call in them to be shown, like so:

<?php echo $this->getChildHtml('unique_name_here'); ?>

That should do it.