New Magento Extension "Moo_CloudZoom"

Overview

I have released a new extension for the Magento E-commerce system. The extension is a replacement for my first extension “Magento JQZoom”.

The new extension has more features including:

  • Smooth zoom movement.
  • Define the dimensions of the zoom window.
  • Define the position of the zoom window.
  • Z/Y pixel spaces for the zoom window.
  • Show or Hide the title on top of the zoom window. Also, define the opacity.
  • Define lens opacity.
  • Dimensions of the main image.
  • Soft focus and inner zoom features.
  • Overlay color and opacity on hover.

The the javascript is based on Cloud Zoom plugin for JQuery.

You can view the extension in Magento connect. Or you can download the file and install it manually from here.

Manual Install

  1. Download the zip file.
  2. Extract the content of the file.
  3. Copy and Paste the folder Moo/ into /app/code/community/
  4. Copy and Paste the folder modules/ into /app/etc/
  5. Copy and Paste the folder skin/ into /[the root directory of your Magento installation]
  6. Copy and Paste the folder design/ into /app/
  7. Login into you admin interface. Go to System > Configuration > Catalog > Moo Product Gallery “CloudZoom” to configure the plugin

FAQ

When I view the configuration page, I get 404 page not found, or 403 access denied?
This is common problem when installing any Magento extension. To fix this you need to refresh the role permission. Go to System > Permissions > Roles > Administrators and click Save Role.
Does it work with Magento stable 1.5.0.1?
Yes
I cannot install the extension. I am getting the following error:

Failed to download magento-community/Moo_CloudZoom within preferred state "stable", latest release is version 1.1.1, stability "beta", use "channel://connect.magentocommerce.com/community/Moo_CloudZoom-1.1.1" to install  
Cannot initialize 'channel://connect.magentocommerce.com/community/Moo_CloudZoom', invalid or missing package file  
Install Errors  
Package "channel://connect.magentocommerce.com/community/Moo_CloudZoom" is not valid  
PEAR ERROR: install failed  
This is because your Magento Connect is set to install extensions with stable version only. This extension is beta. To fix this in Magento Connect click on the settings tab and change the preferred state to beta.

Enjoy! :)

Posted in Magento, PHP and tagged , , .
Loading Facebook Comments ...

Leave a Reply

Your email address will not be published. Required fields are marked *

66 Comments

  1. Mohammed,
    Great plug in! Thanks.

    ..and also thanks to Aurelien for posting the conflict with jquery 1.9. we have multiple extensions on our Magento site and Pronav (by Brandammo) uses 1.9. Commenting out the lines mentioned got them working together. cheers/best

    -Steve

  2. Hi I really like your plugin. Just wanted to note that your JS has a compatibility problem with Jquery 1.9 for the part of checking IE 6 or lower version.

    Simple reason: $.browser is deprecated since jQuery 1.3 and completely removed in jQuery 1.9 (between line 203 and 213)

    /*if ($.browser.msie && $.browser.version < 7) {
    $ie6Fix = $('’).css({
    position: “absolute”,
    left: xPos,
    top: yPos,
    zIndex: 99,
    width: w,
    height: h
    }).insertBefore(zoomDiv)
    }*/

  3. Hi,
    I use this great extension to zoom, but use a lightbox to see image, instead Moo.

    Could I disable click on image to use my original lightbox?

    I’ve tried your comment (“lines 55 and 60”) but nothing happens.

    thanks

  4. Thanks Mohammad you are really helpful. I have high resolution images of 1500px I will upload instead lower resolution.

  5. Hello Muhammad,
    I used your extension. It is excellent. I am facing strange problem. Lens window is the same size as the zoom window. Some of my pages it is fine and some f the pages it equal to zoom window size…. Can you explain the solution of this strange behaviour.
    Here is the link with fine lens window
    http://www.imtinanz.com/popular-products/baxton-studio-julian-black-brown-faux-leather-club-chair-with-360-degree-swivel.html
    and here is link for the same lens size as zoom size
    http://www.imtinanz.com/for-the-home/kitchen-ware/bowl-and-boxes/set-of-four-wood-bowls.html
    I will appreciate your help. Thanks in advance

    • Hi Noho
      The lens box size is relative to the large image. The image in the second link have 2 images (the main visible image and popup image) are similar in size.
      The visible image 300×380. The popup image 371×385. Make sure the popup image (the original) bigger than the visible one.

  6. Great extension…Thanks! I have installed this extension on a testing site. I want to have custom media.phtml files for certain categories. I have managed to use custom media.phtml files via custom design->custom layout update. My question is how can the extension be modified to be able to change the setting on multiple pages? I.e. override the backend settings page and hard code settings into the custom pages.

    • The last time I tested with IE it was working fine. It is possible that your theme interfere with the plugin CSS. I’m currently busy, but what is your URL? I will have a look when I have free time.

  7. Hi, i have implemented this extension but it does not seem to work with IE7. When I zoom and scroll through the image, the zoomed image does not display correctly. please help. 🙂 thanks a lot..

    • It is possible that the CSS you have in your theme interfere with the plugin CSS. I’m currently really busy, but what is the URL of your website. I will have a look when I have free time.

  8. Hi, very nice extension, good works,…. I have just one problem i want to put cloudZoom in the cart items view but i don’t find the solution ( i begin in magento ) can you help me ?

    • Hi Vincent

      The plugin does not work in the cart items view. This is free open source code. I am not currently wanting to implement new features. Perhaps sometime in the future if there is funding for it or if I have some spare time and want to contribute to it.

      Cheers

  9. Great extension, works fine. Just one thing I would like to change.

    When you click on the main image it brings up a popup window. How can I disable this?