Carica js nel piè di pagina in Magento


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

Ho usato il codice sopra per caricare js nel piè di pagina. Ma Magento genera l'errore Like

Metodo non valido Mage_Page_Block_Html_Footer :: addItem (Array ([0] => skin_js [1] => js / fabric / tool / controller_tool.js))

Devo caricare js nel piè di pagina. Come superare questo problema.

Risposte:


8

Attualmente il blocco di piè di pagina Magento non è stato progettato per aggiungere javascript.

Qualche tempo fa ho provato a refactoring Magento e il blocco piè di pagina per caricare tutti i JS nel piè di pagina anziché nell'intestazione, ma il modo in cui la chiamata JS viene chiamata all'interno dei modelli rende molto difficile farlo funzionare.

Il mio suggerimento per risolvere il problema è aggiornare il layout in questo modo:

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

Crea un fabric/tool/controller_tool_js.phtmlfile nella cartella dei modelli con il seguente codice:

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

Fammi sapere se funziona.


11

Il piè di pagina non ha queste funzionalità, ma lo headfa solo perché questo blocco è di tipo page/html_headche contiene questi metodi.

È possibile ottenere ciò inserendo il <script src=...></script>tag JS in un modello ( .phtmlfile) e includerlo come core/templateblocco:

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

Inoltre potresti aggiungerlo attraverso un core/textblocco:

<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>

2

Voglio solo dirti perché addItemnon lavorarereference name="footer"

Quando lo usi reference name="footer", chiamerà questo blocco

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

che troverai page.xmlnel tuo tema.

quindi significa che controllerà il addItemmetodo / funzione in quella classe di blocco o nella loro classe genitore, ma questa funzione non è presente, ecco perché non funzionerà e genererà eccezioni.


2

<reference name="footer">non funziona nel mio caso. Ho trovato un blocco più appropriato per js chiamato 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>

O attraverso un modello separato. percorso: 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>

1

Ho usato un metodo diverso per ottenere ciò che potresti cercare di realizzare. Invece di torcere il braccio di Magento, ho appena caricato il mio script in testa, ma ho impostato un DOMContentLoadedlistener di eventi (non supportato in ie8) su cui esegue i miei compiti.

app / design / frontend / base / default / 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 / comunità / namespace / modulo / 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 / modulo / entry.js

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

1

È possibile aggiungere un nuovo blocco in 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>

quindi aggiungere i file JS e CSS in qualsiasi 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>

Creare il file .phtml nella pagina / html / footerjscss.phtml e aggiungere quanto segue

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

Ora chiama il blocco nel modello di pagina "3columns.phtml" ed ecc. Dovrai generare questo blocco prima del tag:

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

Codice di riferimento qui: http://blog.rahuldadhich.com/magento-load-css-js-footer/

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.