Carregar js no rodapé no Magento

12
<reference name="footer">
    <action method="addItem">
        <type>skin_js</type>
        <file>js/fabric/tool/controller_tool.js</file>
    </action>
</reference>

Eu usei o código acima para carregar js no rodapé. Mas Magento lança erro como

Método inválido Mage_Page_Block_Html_Footer :: addItem (Array ([0] => skin_js [1] => js / fabric / tool / controller_tool.js))

Eu preciso carregar js no rodapé. Como superar esse problema.

Vivek Aasaithambi
fonte

Respostas:

8

Atualmente, o bloco de rodapé do Magento não foi projetado para adicionar javascripts.

Eu tentei há algum tempo refatorar o Magento e o bloco de rodapé para carregar cada JS no rodapé, em vez do cabeçalho, mas a maneira como a chamada de JS é chamada dentro dos modelos torna muito difícil fazer isso funcionar.

Minha sugestão para corrigir seu problema é atualizar seu layout da seguinte maneira:

<reference name="before_body_end">
    <block type="core/template" name="controller_tool_javascript" template="fabric/tool/controller_tool_js.phtml"/>
</reference>

Crie um fabric/tool/controller_tool_js.phtmlarquivo na sua pasta de modelos com o seguinte código:

<script type="text/javascript" src="<?php echo $this->getSkinUrl('js/fabric/tool/controller_tool.js') ?>"></script>

Deixe-me saber se isso funciona.

Raphael na Digital Pianism
fonte
11

O rodapé não possui essas funcionalidades, apenas o headfaz, pois esse bloco é do tipo page/html_headque contém esses métodos.

Você pode conseguir isso colocando a <script src=...></script>tag JS dentro de um modelo ( .phtmlarquivo) e incluí-la como um core/templatebloco:

<reference name="footer">
    <block type="core/template" name="fabric_controller_tool_js" template="fabric/controller_tool_js.phtml" />
</reference>

Você também pode adicioná-lo através de um core/textbloco:

<reference name="footer">
    <block type="core/text" name="fabric_controller_tool_js">
         <action method="setText">
             <text><![CDATA[<script src="/js/fabric/tool/controller_tool.js"></script>]]></text>
         </action>
    </block>
</reference>
7ochem
fonte
2

Só quero lhe dizer por que addItemnão trabalhar emreference name="footer"

Quando você usa reference name="footer", ele chama esse bloco

<block type="page/html_footer" name="footer" as="footer" template="page/html/footer.phtml"> 

que você encontrará page.xmlno seu tema.

portanto, significa que ele verificará o addItemmétodo / função nessa classe de bloco ou em sua classe pai, mas essa função não existe, é por isso que não funcionará e gerará uma exceção.

Murtuza Zabuawala
fonte
2

<reference name="footer">não funciona no meu caso. Eu encontrei o bloco mais apropriado para js chamado js:

<reference name="js">
    <block type="core/text" name="fabric_controller_tool_js">
        <action method="setText">
            <text><![CDATA[<script src="/js/fabric/tool/controller_tool.js"></script>]]></text>
        </action>
    </block>
</reference>

Ou através de um modelo separado. caminho: design / adminhtml / default / default / template / sales / order / js.phtml:

<reference name="js">
    <block type="core/template" name="fabric_controller_tool_js" template="sales/order/js.phtml" />
</reference>
Ruslan Mavlyanov
fonte
1

Eu usei um método diferente para alcançar o que você está procurando realizar. Em vez de torcer o braço do magento, apenas carrego meu script na cabeça, mas defino um DOMContentLoadedouvinte de evento (não suportado no ie8) no qual executa minhas tarefas.

app / design / frontend / base / padrão / layout / namespace_module.xml

<?xml version="1.0" encoding="UTF-8"?>
<layout version="0.0.1">
  <default>
    <reference name="head">
      <action method="addJs">
        <script>NameSpace/Module/entry.js</script>
      </action>
    </reference>
  </default>
</layout>

app / code / community / NameSpace / Module / etc / config.xml

<?xml version="1.0" encoding="UTF-8"?>
<config>
  <modules>
    <NameSpace_Module>
      <version>0.0.1</version>
    </NameSpace_Module>
  </modules>
  <frontend>
    <layout>
      <updates>
        <module>
          <file>namespace_module.xml</file>
        </module>
      </updates>
    </layout>
  </frontend>
</config>

js / NameSpace / Module / entry.js

document.addEventListener("DOMContentLoaded", function(event) {
  // do something
});
Benny Powers
fonte
1

Você pode adicionar um novo bloco no page.xml

<block type="core/text_list" name="before_body_end" as="before_body_end" translate="label">
    <block type="page/html_head" name="footerjscss" as="footerjscss" after="-" template="page/html/footerjscss.phtml"/>
</block>

adicione arquivos JS e CSS em qualquer layout.xml

<reference name="footerjscss">
    <action method="addItem"><type>skin_js</type><name>js/slideshow.js</name></action>
    <action method="addItem"><type>skin_css</type><name>css/madisonisland.css</name><params/><if/></action>
</reference>

Crie o arquivo .phtml na página / html / footerjscss.phtml e adicione o seguinte

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

Agora chame o bloco no modelo de página "3columns.phtml" e etc., você precisará gerar esse bloco antes da tag:

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

Consulte o código aqui: http://blog.rahuldadhich.com/magento-load-css-js-footer/

Rahul Dadhich
fonte