O primeiro passo é criar um bloco chamado "pé", que é essencialmente o mesmo que "cabeça", mas você o produzirá em um local diferente. Você pode adicionar isso ao seu page.xml
:
<block type="page/html_head" name="foot" as="foot" template="page/html/foot.phtml"/>
Agora você pode adicionar JS / CSS (embora CSS no rodapé não seja recomendado) usando este comando em qualquer um dos seus arquivos XML:
<reference name="foot">
<action method="addItem">
<type>skin_js</type>
<name>js/somefile.js</name>
</action>
<action method="addItem">
<type>skin_js</type>
<name>js/main.js</name>
</action>
</reference>
Dentro page/html/foot.phtml
:
<?php echo $this->getCssJsHtml() ?>
<?php echo $this->getChildHtml() ?>
<?php echo $this->helper('core/js')->getTranslatorScript() ?>
<?php echo $this->getIncludes() ?>
Nos arquivos de modelo de sua página (por exemplo page/1column.phtml
), você precisará gerar esse bloco antes da tag de fechamento do corpo:
<?php echo $this->getChildHtml('foot') ?>
Se você estiver usando os modelos Magento padrão, receberá erros de JS. Pegue o mini formulário de pesquisa, por exemplo ( catalogsearch/form.mini.phtml
). Possui este script embutido:
<script type="text/javascript">
//<![CDATA[
var searchForm = new Varien.searchForm('search_mini_form', 'search', '<?php echo $this->__('Search Redset...') ?>');
//]]>
</script>
Isso será chamado assim que carregar, pois não está em nenhum manipulador de documentos prontos. Varien ainda não existe porque está no rodapé, então você recebe um erro. Você pode corrigir isso adicionando um manipulador de documento pronto ou movendo todas as JS embutidas dessa natureza para um arquivo externo que também é carregado no rodapé. Problemas como esse ocorrerão em todo o site, principalmente nas páginas de pagamento e configuráveis do produto.
O outro problema que você pode encontrar é se estiver usando jQuery ao lado de Prototype no modo noConflict. Você precisará garantir que o jQuery seja carregado antes do Prototype, para que não ocorram conflitos.