Como remover o zoom da página de detalhes do produto no tema 1.9 RWD


9

Como você remove o recurso de zoom do tema rwd do Magento 1.9?

Eu posso removê-lo com css

div.zoomContainer {
  display: none;
}

Mas não acho que esse seja o melhor método? Seria melhor removê-lo de um arquivo de modelo ou com xml.

Eu tentei editar o template / catalog / product / view / media.phtml, mas não tive sorte.


Não, não é o método certo, por enquanto, veja a última resposta com minha edição.
— Simbus82 4/04

Respostas:


10

Conforme mencionado em uma das outras respostas, o recurso de zoom inicia na createZoomfunção do arquivo ProductMediaManagerin /skin/frontend/rwd/default/js/app.js.

Portanto, outra opção é substituir a createZoomfunção individual via JS posteriormente no processo.

Por exemplo, se você estiver inserindo JS como parte de seu próprio tema, poderá adicionar o seguinte para substituir a createZoomfunção no ProductMediaManagerobjeto.

// 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; }

}

Com esse método, você não precisa copiar o app.jsarquivo inteiro . No entanto, você deve certificar-se de que o JS do seu tema seja adicionado após o arquivo JS do tema pai. Acho que essa é uma abordagem mais limpa.


Funcionou para mim, mas lembre-se de que a substituição não pode ser carregada tarde demais. Eu o envolvi em um observador pronto para documentos jQuery, e era tarde demais para a substituição fazer qualquer coisa. Em vez disso, tive que executar a substituição corretamente, à medida que meu arquivo JS personalizado foi carregado, então apenas o coloquei fora do observador pronto para documentos do jQuery.
— Louis B.

15

Crie uma substituição do arquivo /skin/frontend/rwd/default/js/app.js (por exemplo, em /skin/frontend/rwd/mystyle/js/app.js)

comente a linha (default line: 649):

//image.elevateZoom();

Atualize o cache do Magento.


11
Eu editei porque é o método certo.
— Simbus82 4/04

2
Uma solução um pouco melhor pode ser simplesmente adicionar uma return;instrução no início desta createZoomfunção na qual esta image.elevateZoom();chamada reside. Dessa forma, nenhum JavaScript do lado do cliente precisa executar em primeiro lugar. (ainda seguem a prática de substituir este arquivo no seu tema local em primeiro lugar)
— Darren Felton

-3

Aberto /frontend/rwd/default/layout/catalog.xml, na <catalog_product_view>seção comentário abaixo da linha

<action method="addItem"><type>skin_js</type><script>js/lib/elevatezoom/jquery.elevateZoom-3.0.8.min.js</script></action>

obrigado, mas se remover essa js arquivo já não posso selecionar as imagens em miniatura para a área principal da galeria
— Holly

Não é o método certo para desativar esta função.
— Simbus82 4/04

3
Você nunca deve modificar os arquivos em / app / design / frontend / rwd / default / layout / OU qualquer um dos arquivos em / app / design / frontend / base / default / layout / . Fazer isso não segue as práticas amigáveis ​​de atualização. As atualizações de layout sempre devem ser feitas em "local.xml" dentro do seu tema. Não há instruções XML de layout que não possam ser substituídas, modificadas, removidas etc. no local.xml.
— Darren Felton

Este jogaria um erro porque ele não seria capaz de encontrar elevatezoom
— Tisch
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.