Remove Cloud Zoom / Menghilangkan efek cloud zoom foto produk di opencart

Fitur cloud zoom atau efek memperbesar gambar pada foto produk (sperti kaca pembesar). Biasanya merupakan fitur tambahan dari suatu theme yang anda install misal theme fabrica dari theme forest.silakan dicek tampilan cloud zoom disini http://themetorium.net/demo/fabrica/index.php?route=product/product&product_id=40

Bagaimana cara menghilangkannya ?agar tampilan foto produk jika diklik bisa tampil secara lightbox/pop up sesuai dari fitur default opencart?

Berikut ini langkah-langkahnya:

1. Masuk ke cpanel web anda
2. Buka folder ini secara berurutan catalog/view/theme/fabrica/template/product/product.tpl
3. Klik kanan dan klik edit file product.tpl
4. Langkah selanjutnya temukan kode dibawah ini 

Step 1

<div class="product-info">
    <?php if ($thumb || $images) { ?>
    <div class="left">
      <?php if ($thumb) { ?>
      <div class="image"><a href="<?php echo $popup; ?>" class="cloud-zoom" id='zoom1' rel="adjustX: 0, adjustY:0"><img src="<?php echo $thumb; ?>" alt="<?php echo $heading_title; ?>" id="image" /></a>
      <div class="zoom"><a id="zoomer" class="colorbox" href="<?php echo $popup; ?>"><?php echo $this->language->get('theme_zoom'); ?></a></div>
      </div>
      <?php } ?>
      <?php if ($images) { ?>
      <div class="image-additional">
        <?php foreach ($images as $image) { ?>
        <a href="<?php echo $image['popup']; ?>" class="cloud-zoom-gallery" rel="useZoom: 'zoom1', smallImage: '<?php echo $image['thumb']; ?>' "><img src="<?php echo $image['thumb']; ?>" width="82" height="82" alt="<?php echo $heading_title; ?>" /></a>
        <?php } ?>
      </div>
      <?php } ?>
    </div>
    <?php } ?>

Step 2
Masuk ke Admin opencart anda,sistem> setting> klik edit > klik tab "image" > ganti Additional Product Image Size" ke 82x82

Step 3
Masuk ke cpanel anda lagi dan buka catalog/view/theme/fabrica/template/common/header.tpl
Dan hapus kode ini:

<script type="text/JavaScript" src="catalog/view/theme/fabrica/js/cloud-zoom.1.0.2.js"></script>

Step 4
Masuk ke catalog/view/theme/fabrica/js
hapus file dengan nama cloud-zoom.1.0.2.js

Done, efek Cloud zoom pada foto produk anda sudah ganti dengan pop up/lightbox

Posted by Numpak Gundam

Tweet