Gibt es eine Möglichkeit, JS / CSS zur Fußzeilenseite hinzuzufügen?

Ich habe eine benutzerdefinierte Anforderung, ein bestimmtes JS und CSS hinzuzufügen, die sich auf die Fußzeile der Website beziehen . Gibt es in Magento eine Möglichkeit, es in der Fußzeile hinzuzufügen ?

Der footerBlock bietet keine Unterstützung für js direkt, wie der Kopf.

Es gibt jedoch einen Block mit dem Namen, before_body_endin dem Sie mit einer Vorlage oder einem Textblock alles hinzufügen können, was Sie möchten.

Ich würde über Ihre eigene Vorlage und den Blocktyp nachdenken Mage_Page_Block_Html_Head, dann können Sie das verwenden, was @Dexter empfohlen hat.

Nein, Sie benötigen so etwas, Sie haben auch keinen page / html_head-Block, auf den Sie verweisen können:

<!-- get the block which we want our content in -->
<reference name="before_body_end">
    <!-- add another block of type page/html_head to have all the great functionality to add/remove css and js stuff -->
    <!-- it is important to set your own template, because the head block has a defined default template page/head.phtml which has all the stuff of the head. Using this will bring a lot of problems -->
    <block type="page/html_head" name="scripts_in_footer" template="YOUR TEMPLATE">
        <!-- add whatever you want as you are used to in the head via the standard magento api -->
        <action method="addItem"><type>skin_css</type><name>css/styles.css</name></action>
    </block>
</reference>

Und innerhalb Ihrer Vorlage benötigen Sie:

<?php // and to echo the whole stuff later in the template, you need to add the code, so the added js/Css files are echoed ?>
<?php echo $this->getCssJsHtml() ?>
<?php echo $this->getChildHtml() ?>

Der Kopf- und Fußzeilenteil wird vom Seitenmodul in Magento gerendert. Um Kopf- und Fußzeilenvorlagen anzuzeigen, gehen Sie zu

app / design / frontend/ <your_package> /<your_theme> /template / page / html / footer.phtml

Schauen Sie sich auch andere Dateien im Seitenordner an. Dort können Sie sehen, header.phtmlwelcher Render-Header-Abschnitt jeder Seite angezeigt wird. head.phtmlVerwenden Sie diese Option, um JS- und CSS-Dateien hinzuzufügen, die für alle Seiten in Magento gelten.

Siehe auch Dateien im Seitenordner. Diese Dateien werden für jede Seite gemäß der Layoutspezifikation einer bestimmten Seite gerendert.

Machen Sie eine ernsthafte Studie über dieses Modul. Es wird dir sehr helfen.

bearbeiten

Sie können Ihre CSS und JS über page.xml hinzufügen. Ich denke, es wird Ihr Problem lösen. Gehe zu

app / design / frontend/ <your_package> /<your_theme> / layout / page.xml

und fügen Sie dieses Code-Snippet hinzu defeault handle. (In diesem Handle werden viele JS- und CSS-Dateien hinzugefügt. Fügen Sie einfach diesen Code unter diesen Codes hinzu.)

 //this will add your js
 <action method="addItem">
     <type>skin_js</type>
     <name>js/yourjsfile.js</name>
 </action>  
 //this will add your css file
 <action method="addItem">
     <type>skin_css</type>
     <name>js/yourcssfile.css</name>
 </action>

Das ist es. Stellen Sie nun sicher, dass sich Ihre benutzerdefinierten JS- und CSS-Dateien am Speicherort befinden

  skin/frontend/<your_package> /<your_theme>/js/yourjsfile.js
  skin/frontend/<your_package> /<your_theme>/css/yourcssfile.css

Viel Glück für Ihre Arbeit.

Verwenden Sie dafür XML. Um Js in die Fußzeile einzufügen, rufen Sie die Fußzeilenreferenz auf. Der Code sieht ungefähr so ​​aus

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

Um JS zum Skin-Ordner hinzuzufügen, können Sie den folgenden Code verwenden

    <reference name="footer">
    <action method="addItem"><type>skin_js</type><name>js/test.js</name></action>
</reference>

Zum Hinzufügen von CSS können Sie den folgenden XML-Code verwenden

<reference name="footer">
    <action method="addCss"><stylesheet>css/layout.css</stylesheet></action>
</reference>

oder Sie können auch verwenden

<reference name="footer">
<action method="addItem"><type>skin_css</type><name>css/styles.css</name></action>
  </reference>

Haben Sie für Javascript in Betracht gezogen, nur onload oder jquerys $ (document) .ready () zu verwenden?

Auf diese Weise können Sie Ihren Code wie im typischen Setup in den Header einfügen, ihn jedoch erst ausführen, wenn der Inhalt geladen ist, auf den Ihr js verweist.

Ihr js-Dateiname.js-Code würde folgendermaßen aussehen:

$(document).ready( function(){
   your custom js here
});

Der Code für Ihr Layout würde folgendermaßen aussehen: (Sie müssten natürlich die entsprechenden Verzeichnisse hinzufügen, sobald Sie sie eingerichtet haben.)

<reference name="head">
   <action method="addItem"><type>js</type><name>js/jquery/jquery.js</name></action>
   <action method="addItem"><type>js</type><name>js/filename.js</name></action>
</reference>

Ja, es gibt eine Möglichkeit, aber Sie müssen über den folgenden Code hinzufügen: Fügen Sie diesen Code am Ende der Datei 1column.phtml kurz vor dem Ende des <body>Tags hinzu.

<script src="<?php echo $this->getSkinUrl('js/jquery.noConflict.js') ?>"></script>

Ich empfehle das Mediarox-Pagespeed-Modul, um Ihnen zu helfen, Ihr Javascript (und CSS) zu optimieren und das Ranking der Google Pagespeed-Einblicke zu verbessern.

Es funktioniert, indem die von Magento ausgegebene HTML-Ausgabe analysiert und anschließend eine Aktion zum Ausschneiden und Einfügen des Codes ausgeführt wird, um Javascript an den unteren Rand des HTML-Codes zu verschieben. Der Prozess ist schnell, wird jedoch am besten in Verbindung mit einem Ganzseiten-Cache verwendet, um die HTML-Änderungen zwischenzuspeichern.

Weitere Informationen zur Funktionsweise dieses Moduls und zur Verbesserung des Seitengeschwindigkeitsrangs finden Sie hier:

http://blog.gaiterjones.com/magento-google-pagespeed-jscsshtmlminify-optimisation/