Exemplo 1

Altere a tag <ImagemProd> para:

<a href="<ImagemProdAmp>" data-options="hint:off" class="MagicZoom"><img src="<ImagemProdDet>"/></a>

Veja recurso em funcionamento ao passar o cursor do mouse por cima da imagem:

Exemplo 2

Altere a tag <ImagemProd> para:

<a href="<ImagemProdAmp>" data-options="zoomWidth:400px;zoomHeight:170px;;hint:off" class="MagicZoom"><img src="<ImagemProdDet>"/></a>

Veja recurso em funcionamento ao passar o cursor do mouse por cima da imagem:

Exemplo 3

Altere a tag <ImagemProd> para:

<a href="<ImagemProdAmp>" data-options="zoomWidth:70%;zoomHeight:100%;hint:off" class="MagicZoom"><img src="<ImagemProdDet>"/></a>

Veja recurso em funcionamento ao passar o cursor do mouse por cima da imagem:

Exemplo 4

Altere a tag <ImagemProd> para:

<a href="<ImagemProdAmp>" data-options="zoomPosition:top;expand:false;hint:off;" class="MagicZoom">
<img src="<ImagemProdDet>"/></a>

Veja recurso em funcionamento ao clicar por cima da imagem:

Exemplo 5

Altere a tag <ImagemProd> para:

<a href="<ImagemProdAmp>" data-options="zoomPosition:inner;hint:off;" class="MagicZoom">
<img src="<ImagemProdDet>"/></a>

Veja recurso em funcionamento ao passar o cursor do mouse por cima da imagem:

Exemplo 6

Altere a tag <ImagemProd> para:

<a href="<ImagemProdAmp>" data-options="zoomMode:magnifier;hint:off;" 
class="MagicZoom"><img src="<ImagemProdDet>"/></a>

Veja recurso em funcionamento ao passar o cursor do mouse por cima da imagem:

ATENÇÃO: Para o recurso de zoom funcionar corretamente na loja virtual é necessário ativar o Nível 1 no campo Lazy load de imagens na página Dados da loja.