In Magento wird defaultmäßig Scriptaculous als Javascript-Framework verwendet. Mit Hilfe von Scriptaculous werden die Effekte in Magento von Hause aus gesteuert. Wie ihr jetzt noch zusätzlich Jquery in den Magento-Shop bekommt, erfahrt ihr mit diesem Artikel.

Zunächst einmal muss sichergestellt werden, dass die Javascript- bzw. Jquery-Dateien korrekt in die HTML-Seite eingefügt werden. Dazu muss in der page.xml, die ihr unter app/design/frontend/default/TEMPLATE/layout/ findet, folgender Quellcode ergänzt werden:

<block type="page/html_head" name="head" as="head">
  ...
 <action method="addJs"><script>scripts/jquery-1.6.min.js</script></action>
 <action method="addJs"><script>scripts/blogrammierer.js</script></action>
</block>

Die Jquery-Dateien sollten dann im Root-Verzeichnis von Magento im Ordner /js/scripts/ liegen, um auch gefunden zu werden. Die Jquery-Scripte können dann in der Datei blogrammierer.js eingefügt werden, allerdings muss darauf geachtet werden, dass sie folgendermaßen aufgebaut sind:

$.noConflict();
jQuery(document).ready(function($) {      
  // Hier der eigentliche Jquery-Quellcode
}); 

Damit Scriptaculous und Jquery reibungslos nebeneinander funktionieren, muss Jquery in der Noscript-Variante eingebunden werden, da das $-Zeichen ebenfalls von Scriptacolous verwendet wird. Sollte man Jquery in gewohnter Weise einbinden, funktionieren beide Frameworks nicht mehr.