Comment supprimer le zoom de la page des détails du produit sur le thème 1.9 RWD

9

Comment supprimer la fonction de zoom du thème rwd de Magento 1.9?

Je peux l'enlever avec css

div.zoomContainer {
  display: none;
}

Mais je ne pense pas que ce soit la meilleure méthode? Il serait préférable de le supprimer d'un fichier modèle ou avec xml.

J'ai essayé de modifier le modèle / catalogue / produit / vue / media.phtml mais je n'ai pas eu de chance.

magento-1.9 ce-1.9.0.1 rwd rwd-theme product-view houx
la source
Non, ce n'est pas la bonne méthode, pour l'instant voir la dernière réponse avec ma modification.
Simbus82

Réponses:

10

Comme mentionné dans l'une des autres réponses, la fonction de zoom démarre dans la createZoomfonction du fichier ProductMediaManagerin /skin/frontend/rwd/default/js/app.js.

Ainsi, une autre option consiste à remplacer la createZoomfonction individuelle via JS plus tard dans le processus.

Par exemple, si vous insérez JS en tant que partie de votre propre thème, vous pouvez ajouter ce qui suit pour remplacer la createZoomfonction dans l' ProductMediaManagerobjet. 

// ProductMediaManager is outside document.read scope
if (typeof ProductMediaManager !== 'undefined') {

  // Override image zoom in /skin/frontend/rwd/default/js/app.js
  // and prevent the zooming of images on hover
  ProductMediaManager.createZoom = function(image) { return; }

}

Avec cette méthode, vous n'avez pas à copier l'intégralité du app.jsfichier. Cependant, vous devez vous assurer que le JS de votre thème est ajouté après le fichier JS du thème parent. Je trouve que c'est une approche plus propre.

Patrick Ward
la source
A fonctionné pour moi, mais gardez à l'esprit que l'écrasement ne peut pas être chargé trop tard. Je l'avais enveloppé dans un observateur prêt pour le document jQuery, et il était trop tard pour que l'écrasement fasse quoi que ce soit. Au lieu de cela, j'ai dû exécuter le droit d'écrasement lors du chargement de mon fichier JS personnalisé, je l'ai donc placé juste en dehors de l'observateur prêt pour le document jQuery.
Louis B.15
15

Créez un remplacement du fichier /skin/frontend/rwd/default/js/app.js (par exemple dans /skin/frontend/rwd/mystyle/js/app.js)

commentez la ligne (default line: 649):

//image.elevateZoom();

Actualisez le cache Magento.

user90047
la source
1
J'ai édité car c'est la bonne méthode.
Simbus82
2
Une solution légèrement meilleure peut être d'ajouter simplement une return;instruction au tout début de cette createZoomfonction dans laquelle image.elevateZoom();réside cet appel. De cette façon, aucun JavaScript côté client n'a même à s'exécuter en premier lieu. (suivez toujours la pratique de remplacer ce fichier dans votre thème local en premier)
Darren Felton
-3

Ouvrir /frontend/rwd/default/layout/catalog.xml, dans la <catalog_product_view>section commentaire sous la ligne

<action method="addItem"><type>skin_js</type><script>js/lib/elevatezoom/jquery.elevateZoom-3.0.8.min.js</script></action>
WisdmLabs
la source
merci, mais si vous supprimez ce fichier js, je ne peux plus sélectionner les images miniatures pour la zone de la galerie principale
Holly
Ce n'est pas une bonne méthode pour désactiver cette fonction.
Simbus82
3
Vous ne devez jamais modifier les fichiers dans / app / design / frontend / rwd / default / layout / OU aucun des fichiers dans / app / design / frontend / base / default / layout / . Cela ne suit pas les pratiques conviviales de mise à niveau. Les mises à jour de la mise en page doivent toujours être effectuées dans "local.xml" dans votre thème. Il n'y a pas d'instructions XML de mise en page, qui ne peuvent pas être remplacées, modifiées, supprimées, etc., dans local.xml.
Darren Felton
Cela provoquerait une erreur car il ne pourrait pas trouver elevatezoom
Tisch