De base, Magento utilise la librairie Prototype qui utilise la même fonction $() que jQuery.

Pour se faire, jQuery utilise un mode spécial pour éviter le conflit entre ces 2 librairies.

• Téléchargez la dernière version de scriptaculous et de jQuery.
• Copier le fichier scriptaculous/effects.js à la place de /js/scriptaculous/effects.js
• Dans le dossier /js/, créez un dossier « jquery » et placez-y jquery-*.*.*.min.js. Vous devriez donc avoir : /js/jquery/jquery-*.*.*.min.js
• A la fin de jquery-*.*.*.min.js, ajoutez : jQuery.noConflict();
• Ouvrez app/design/frontend/{interface}/{theme}/layout/page.xml et repérez le code :

<action method="addJs"><script>mage/cookies.js</script></action>

Insérez après ce code ceci :

<action method="addJs"><script>jquery/jquery-*.*.*.min.js</script></action>

Usage :

Au lieu d’écrire :

$("div.spoil").hide

Remplacer les $ par jQuery :

jQuery("div.spoil").hide