Magic Zoom™ for Joomla
Magic Zoom™ reveals a very detailed image when the mouse is moved over a smaller image.
Add it to your Joomla 1.5 or Joomla 1.0 website using the module below. Or use it on VirtueMart.
Joomla 1.5 instructions
- Download and install the Magic Zoom™ Joomla 1.5 content module.
- Enable the module.
- The demo version is ready to use!
- Follow the instructions below: "Setting up an image zoom".
- To upgrade to the full version, buy Magic Zoom™ and upload the mz-packed.js file to this folder: /modules/mod_magiczoom/core/.
Joomla 1.0 instructions
- Download the Magic Toolox TinyMCE module. This will allow you to insert class and rel attributes for <a> links in the WYSIWYG content editor. (Without it, TinyMCE will remove these attributes by default for some unknown reason).
- Install the module using the Joomla installer menu.
- Open the module properties (Modules → Administrator Modules → MagicToolbox TinyMCE editor fix).
- Publish the module.
- Set the module position to "header".
- Download the Magic Zoom™ content module (demo version).
- Install it using the Joomla installer menu.
- Open the module properties.
- Publish the module.
- Set the “Show title” to off.
- That's all! Now follow the instructions below to set-up an image zoom.
- To upgrade to the full version, buy Magic Zoom™ and upload the mz-packed.js file to this folder: /modules/mod_magiczoom/core/.
Setting up an image zoom
Summary of process
- Add a small image to your content (either by using TinyMCE image wizard or using mos_image extension).
- Add a link (<a> tag) around the image with the HREF pointing to the big image and a CLASS attribute set to "MagicZoom".
Step-by-step
Open the page where you want to use Magic Zoom™.

Insert the small image using the TinyMCE image wizard:

Or, insert the small image using the mos_image extension. Firstly, upload the small and big images to your Joomla gallery (Site → Media Manager):

Secondly, select your small image using the right menu. Add the {mosimage} tag in your page:

Select the image you just added and click "Insert/Edit link icon" in the editor toolbar:
- For the HREF attribute, enter the URL of the big image.

- Go to the "Advanced" tab and set the CLASS value to MagicZoom:

- If you would like to add a caption to the image, enter a TITLE of your choice.
- Click "Insert".
Now save your page, open your website and enjoy your cool new Joomla zoom!

Note: the Magic Zoom Joomla plugin has been replaced with a Joomla module.
Other Joomla modules
Installation guides
Use Magic Zoom™ on any website. Download a module/plugin for a specific platform: