Magento从产品图片中删除缩放

时间:2014-07-16 10:19:18

标签: magento image-zoom

我对Magento并不熟悉,我需要从产品图片中删除缩放效果。 这是模板目录中/catalog/product/view/media.phtml的代码。

我试着玩if-else语句,但似乎我错过了一些东西,因为我收到了错误。

有人比较熟悉这个吗? 非常感谢!

    <div class="product-image">
<?php if ($scrollStatus): ?>
    <div id="jp-container" class="jp-container" style="height:500px;">
        <a href="javascript:void(0);"><?php
            $_img = '<img src="'.$helpImg->getImg($_product, 'image', $imgSize, null).'" alt="'.$this->escapeHtml($this->getImageLabel()).'" title="'.$this->escapeHtml($this->getImageLabel()).'" />';
                echo $_img;
        ?></a>
        <?php foreach ($this->getGalleryImages() as $_image): ?>
            <a href="javascript:void(0);" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>"><img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile()); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a>
        <?php endforeach; ?>
    </div>
    <script type="text/javascript">
    jQuery(window).load(function(){
        function jspaneStart(){
            setTimeout(function(){
                maxHeight = 0;
                jQuery('#jp-container a').each(function(){
                    if(jQuery(this).height() > maxHeight){
                        maxHeight = jQuery(this).height();
                    }
                });
                maxHeight = maxHeight+(maxHeight/100)*<?php echo $scrollimagesHeight; ?>;
                jQuery('#jp-container').css('height', maxHeight);
                jQuery('#jp-container').jScrollPane();
            }, 500);
        }
        jspaneStart();
        jQuery(window).resize(function(){
            jspaneStart();
        });
    });
    </script>
<?php else: ?>
    <a id='zoom' class="cloud-zoom" data-zoom="showTitle: false, adjustX: -5, adjustY:-5, tint: '#fff', tintOpacity:0.6, position:'inside'" href="<?php echo $this->helper('catalog/image')->init($_product, 'image'); ?>"><?php
            $_img = '<img id="image" src="'.$helpImg->getImg($_product, 'image', $imgSize, null).'" alt="'.$this->escapeHtml($this->getImageLabel()).'" title="'.$this->escapeHtml($this->getImageLabel()).'" />';
                echo $_helper->productAttribute($_product, $_img, 'image');
        ?></a>
        <?php /* Label New */ echo MAGE::helper('ThemeOptionsMinimalism')->getProductLabels($_product); ?>

    <?php if (count($this->getGalleryImages()) > 0): ?>
    <div class="more-views-container">
        <div class="more-views<?php if ($productpage_moreviews == 'moreviews_slider' && count($this->getGalleryImages()) > 3){echo ' slider-on';} ?>">
            <h2><?php echo $this->__('More Views') ?></h2>
            <?php if ($productpage_moreviews == 'moreviews_slider' && count($this->getGalleryImages()) > 3): ?>
            <div id="more-views-slider" class="es-carousel-wrapper">
                <ul class="carousel-ul">
                <?php foreach ($this->getGalleryImages() as $_image): ?>
                    <li>
                        <a class='cloud-zoom-gallery' data-zoom="useZoom: 'zoom', smallImage: '<?php echo $helpImg->getImg($_product, 'thumbnail', $imgSize, null, $_image->getFile()); ?>' " href="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile()); ?>" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>"><img <?php echo $helpImg->getImgSources($_product, 'thumbnail', 200, null, $_image->getFile()); ?> alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a>
                    </li>
                <?php endforeach; ?>
                </ul>
            </div>
            <div class = 'next'><i class="fa fa-angle-right"></i></div>
            <div class = 'prev unselectable'><i class="fa fa-angle-left"></i></div>
            <?php else: ?>
            <ul class="no-slider">
                <?php foreach ($this->getGalleryImages() as $_image): ?>
                    <li>
                        <a class='cloud-zoom-gallery' data-zoom="useZoom: 'zoom', smallImage: '<?php echo $helpImg->getImg($_product, 'thumbnail', $imgSize, null, $_image->getFile()); ?>' " href="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile()); ?>" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>"><img <?php echo $helpImg->getImgSources($_product, 'thumbnail', 200, null, $_image->getFile()); ?> alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a>
                    </li>
                <?php endforeach; ?>
            </ul>
            <?php endif; ?>
        </div>
    </div>
    <?php endif; ?>
<?php endif; ?>
<?php if ($this->displayProductStockStatus()): ?>
    <?php if ($_product->isAvailable()): ?>
       <p class="availability in-stock"><i class="fa fa-check"></i><?php echo $this->__('In stock') ?></p>
    <?php else: ?>
       <p class="availability out-of-stock"><i class="fa fa-times"></i><?php echo $this->__('Out of stock') ?></p>
    <?php endif; ?>
<?php endif; ?>
</div>

4 个答案:

答案 0 :(得分:1)

您可以从magento js禁用缩放。 只需找到此文件js \ varien \ product.js并注释此行

Event.observe(this.imageEl, 'dblclick', this.toggleFull.bind(this));

此行默认负责图像缩放。

答案 1 :(得分:0)

转到Admin,然后转到System -> Configuration。然后转到Manage -> Advanced -> Disable Modules Output -> EcommerceTeam_CloudZoom -> Disable。点击保存Config

然后转到

System -> Configuration ->Catalog

Cloud Image Zoom下的下一页上,您将找到配置模块的选项列表。 Enable Cloud Zoom - 选择no时,该选项会禁用产品图片中的Cloud Zoom。

完成后点击右上角的‘Save Config’

答案 2 :(得分:0)

您总是可以尝试通过app / etc / modules中的模块xml文件完全禁用该模块

与缩放模块相关的xml文件如下所示:

<?xml version="1.0" encoding="utf-8"?>
<config>
    <modules>
        <module_name>
            <active>true</active>
            <codePool>community</codePool>
        </module_name>
    </modules>
</config>

只需将active设置为false

答案 3 :(得分:0)

这个答案对我有用:

在主题中的media.phtml中添加JS。

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

    }

我找到了here

的答案

感谢“Patrick Ward”提供优质而简单的解决方案......