Improve your Miva online shop

Miva Merchant is a flexible and secure ecommerce platform that is easy to get started with. However, it lacks good image zoom tools, so you need an addon to make your store look more professional and elegant.

That's why you need Magic Toolbox. These 3 magnificent image effects below will excite your customers, pushing them towards buying your products. The all-time favourite, Magic Zoom Plus, is a beautiful image zoom module which zooms & enlarges product images. For lower budgets, choose either the clean and simple Magic Zoom (zoom) or the graceful Magic Thumb (lightbox).

Magic Zoom Plus for Miva Merchant

The premium Miva zoom plugin - for those wishing to maximise sales.

  • Delightful to use on mobiles and desktops alike.
  • Zoom on hover, enlarge on click - best of both worlds.
Buy now £49  Download Free Trial
Supported versions
    All latest versions

98%    of shoppers say its their favourite zoom

Downloads   
410+

Key features

Responsive

Fast loading

SEO friendly

Supports video

Easy to customise

Switchable thumbnails

Friendly support

One-off payment

jQuery compatible

Regularly updated

Lazy loading

Optimised for mobile

Installation

Miva 5.5 PR8 with Image Machine installation

  1. Download Magic Zoom Plus (free and fully functional demo version).
  2. Unzip the file and upload the magiczoomplus folder to this location on your Miva website:
    httpdocs/magiczoomplus
  3. Download this file: magic-miva-imagemachine.js (right click it and "Save as"), then copy that file to the magiczoomplus folder.
  4. In your Miva admin panel, go to the User Interface > Pages menu.
  5. Find the page Product Display with ID=PROD and click the Edit button on the right.
  6. Insert the following code in the Template section (before tag):
    <link rel="stylesheet" href="/magiczoomplus/magiczoomplus.css">
<script src="/magiczoomplus/magiczoomplus.js"></script>
<script src="/magiczoomplus/magic-miva-imagemachine.js?tool=MagicZoomPlus"></script>
  7. Click the Update button at the bottom of the page.
  8. Now your images should zoom! Contact us if you need help.
  9. Buy Magic Zoom Plus To upgrade your free and fully functional trial version of Magic Zoom Plus (which removes the "Trial version" text), buy Magic Zoom Plus. Then overwrite the demo magiczoomplus.js file with the one from your licensed version.

Miva 5.5 installation

  1. Download Magic Zoom Plus (free and fully functional demo version).
  2. Unzip the file and upload the magiczoomplus folder to this location on your Miva website:
    httpdocs/magiczoomplus
  3. In your Miva admin panel, go to the Pages menu.
  4. Find the page Product Display with ID=PROD and click the Edit button on the right.
  5. At the top, click the link "Product Display Layout".
  6. Find the line:
    <img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
    and replace it with:
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
<a id="mtbMainImage" href="&mvt:product:customfield_values:customfields:ZoomImage;" class="MagicZoom">
</mvt:if>
<img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
<mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
</a>
</mvt:if>
  7. The next 4 steps will add 2 alternative product images with thumbnails (so your page will show 3 product images in total). There is no standard method for adding multiple product images on a Miva page, so you may need to adjust these instructions for your site. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView1');"><img src="&mvt:product:customfield_values:customfields:AltView1Thm;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView1;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:AltView1;"><img src="&mvt:product:customfield_values:customfields:AltView1Thm;" class="Mini" width="75"></a>
  8. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView1');"><img src="&mvt:product:customfield_values:customfields:AltView1;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView1;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:AltView1;"><img src="&mvt:product:customfield_values:customfields:AltView1;" class="Mini" width="75"></a>
  9. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView2');"><img src="&mvt:product:customfield_values:customfields:AltView2Thm;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView2;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:AltView2;"><img src="&mvt:product:customfield_values:customfields:AltView2Thm;" class="Mini" width="75"></a>
  10. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView2');"><img src="&mvt:product:customfield_values:customfields:AltView2;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView2;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:AltView2;"><img src="&mvt:product:customfield_values:customfields:AltView2;" class="Mini" width="75"></a>
  11. Find this line:
    <a href="javascript:IM_ZoomPopup('Zoom');"><img src="&mvt:product:customfield_values:customfields:ZoomThm;" class="MagicZoom" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:ZoomImage;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:ZoomImage;"><img src="&mvt:product:customfield_values:customfields:ZoomThm;" class="Mini" width="75"></a>
  12. Find this line:
    <a href="javascript:IM_ZoomPopup('Zoom');"><img src="&mvt:product:customfield_values:customfields:ZoomImage;" class="MagicZoom" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:ZoomImage;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:ZoomImage;"><img src="&mvt:product:customfield_values:customfields:ZoomImage;" class="Mini" width="75"></a>
  13. Click the Update button at the bottom of the page when finished.
  14. At the top, click the link "HEAD Tag Content/CSS".
  15. Insert the following lines at the top of template:
    <link rel="stylesheet" href="/magiczoomplus/magiczoomplus.css">
<script src="/magiczoomplus/magiczoomplus.js"></script>
  16. Click the Update button at the bottom of the page.
  17. Enjoy!
  18. Buy Magic Zoom Plus To upgrade your free and fully functional trial version of Magic Zoom Plus (which removes the "Trial version" text), buy Magic Zoom Plus. Then overwrite the demo magiczoomplus.js file with the one from your licensed version.

Product attributes

Black Maroon Obsidian Seaweed

Do your products come in different colours or styles?Each product within a Miva ecommerce store offers the option to add attributes.

A perfect way to display all colours, sizes, prices, styles of your items.

Magic Zoom Plus supports Miva Merchant product attributes out of the box.

Uninstallation

Thanks for trying Magic Zoom Plus on your Miva Merchant site! What did you hope Magic Zoom Plus could do? How can we improve it? Let us know, we're always improving our tools based on customer feedback.

Miva 5.5 PR8 with Image Machine uninstallation

  1. In your Miva admin panel, go to the User Interface > Pages menu.
  2. Find the page Product Display with ID=PROD and click the Edit button on the right.
  3. At the top, click the link "HEAD Tag Content/CSS".
  4. Delete the following lines from the top of template:
    <link rel="stylesheet" href="/magiczoomplus/magiczoomplus.css">
<script src="/magiczoomplus/magiczoomplus.js"></script>
<script src="/magiczoomplus/magic-miva-imagemachine.js?tool=MagicZoomPlus"></script>
  5. Click the Update button at the bottom of the page.
  6. Delete the magiczoomplus folder from this location on your Miva website:
    httpdocs/magiczoomplus
  7. Magic Zoom Plus is now uninstalled.

Miva 5.5 uninstallation

  1. In your Miva admin panel, go to the Pages menu.
  2. Find the page Product Display with ID=PROD and click the Edit button on the right.
  3. At the top, click the link "HEAD Tag Content/CSS".
  4. Delete the following lines from the top of template:
    <link rel="stylesheet" href="/magiczoomplus/magiczoomplus.css">
<script src="/magiczoomplus/magiczoomplus.js"></script>
  5. At the top, click the link "Product Display Layout".
  6. Find the code:
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
<a id="mtbMainImage" href="&mvt:product:customfield_values:customfields:ZoomImage;" class="MagicZoom">
</mvt:if>
<img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
<mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
</a>
</mvt:if>
    and replace it with:
    <img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
  7. If you added 2 alternative product images with thumbnails as part of the installation, then reverse Steps 7, 8, 9, 10, 11 & 12 from the Installation instructions > Click the Update button at the bottom of the page.
  8. Delete the magiczoomplus folder from this location on your Miva website:
    httpdocs/magiczoomplus
  9. Magic Zoom Plus is now uninstalled.
  1. Frith, 6peasdesignandmarketing.com
    Frith
    6peasdesignandmarketing.com
  2. Francis Tapon, wanderlearn.com
    Francis Tapon
    wanderlearn.com
  3. Chris Berkeley, netmastery.com.au
    Chris Berkeley
    netmastery.com.au

Magic Zoom Plus for Miva Merchant

Buy now  £49  Download Free Trial

Magic Zoom for Miva Merchant

Instantly bring refinement to your Miva product images.

  • Responsive design adapts to your design on any device.
  • Smooth zoom movement, for a refined experience.
Buy now £29  Download Free Trial
Supported versions
    All latest versions

93%    of users say it boosted their sales

Downloads   
500+

Key features

Responsive

Fast loading

SEO friendly

Supports video

Easy to customise

Switchable thumbnails

Friendly support

One-off payment

Regularly updated

jQuery compatible

On-demand loading

Optimised for mobile

Installation

Miva 5.5 PR8 with Image Machine installation

  1. Download Magic Zoom (free and fully functional demo version).
  2. Unzip the file and upload the magiczoom folder to this location on your Miva website:
    httpdocs/magiczoom
  3. Download this file: magic-miva-imagemachine.js (right click it and "Save as"), then copy that file to the magiczoom folder.
  4. In your Miva admin panel, go to the User Interface > Pages menu.
  5. Find the page Product Display with ID=PROD and click the Edit button on the right.
  6. Insert the following code in the Template section (before tag):
    <link rel="stylesheet" href="/magiczoom/magiczoom.css">
<script src="/magiczoom/magiczoom.js"></script>
<script src="/magiczoom/magic-miva-imagemachine.js?tool=MagicZoom"></script>
  7. Click the Update button at the bottom of the page.
  8. Now your images should zoom! Contact us if you need help.
  9. Buy Magic Zoom To upgrade your free and fully functional trial version of Magic Zoom (which removes the "Trial version" text), buy Magic Zoom. Then overwrite the demo magiczoom.js file with the one from your licensed version.

Miva 5.5 installation

  1. Download Magic Zoom (free and fully functional demo version).
  2. Unzip the file and upload the magiczoom folder to this location on your Miva website:
    httpdocs/magiczoom
  3. In your Miva admin panel, go to the Pages menu.
  4. Find the page Product Display with ID=PROD and click the Edit button on the right.
  5. At the top, click the link "Product Display Layout".
  6. Find the line:
    <img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
    and replace it with:
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
<a id="mtbMainImage" href="&mvt:product:customfield_values:customfields:ZoomImage;" class="MagicZoom">
</mvt:if>
<img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
<mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
</a>
</mvt:if>
  7. The next 4 steps will add 2 alternative product images with thumbnails (so your page will show 3 product images in total). There is no standard method for adding multiple product images on a Miva page, so you may need to adjust these instructions for your site. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView1');"><img src="&mvt:product:customfield_values:customfields:AltView1Thm;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView1;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:AltView1;"><img src="&mvt:product:customfield_values:customfields:AltView1Thm;" class="Mini" width="75"></a>
  8. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView1');"><img src="&mvt:product:customfield_values:customfields:AltView1;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView1;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:AltView1;"><img src="&mvt:product:customfield_values:customfields:AltView1;" class="Mini" width="75"></a>
  9. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView2');"><img src="&mvt:product:customfield_values:customfields:AltView2Thm;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView2;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:AltView2;"><img src="&mvt:product:customfield_values:customfields:AltView2Thm;" class="Mini" width="75"></a>
  10. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView2');"><img src="&mvt:product:customfield_values:customfields:AltView2;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView2;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:AltView2;"><img src="&mvt:product:customfield_values:customfields:AltView2;" class="Mini" width="75"></a>
  11. Find this line:
    <a href="javascript:IM_ZoomPopup('Zoom');"><img src="&mvt:product:customfield_values:customfields:ZoomThm;" class="MagicZoom" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:ZoomImage;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:ZoomImage;"><img src="&mvt:product:customfield_values:customfields:ZoomThm;" class="Mini" width="75"></a>
  12. Find this line:
    <a href="javascript:IM_ZoomPopup('Zoom');"><img src="&mvt:product:customfield_values:customfields:ZoomImage;" class="MagicZoom" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:ZoomImage;" data-zoom-id="mtbMainImage" data-image="&mvt:product:customfield_values:customfields:ZoomImage;"><img src="&mvt:product:customfield_values:customfields:ZoomImage;" class="Mini" width="75"></a>
  13. Click the Update button at the bottom of the page when finished.
  14. At the top, click the link "HEAD Tag Content/CSS".
  15. Insert the following lines at the top of template:
    <link rel="stylesheet" href="/magiczoom/magiczoom.css">
<script src="/magiczoom/magiczoom.js"></script>
  16. Click the Update button at the bottom of the page.
  17. Enjoy!
  18. Buy Magic Zoom To upgrade your free and fully functional trial version of Magic Zoom (which removes the "Trial version" text), buy Magic Zoom. Then overwrite the demo magiczoom.js file with the one from your licensed version.

Product attributes

Black Maroon Obsidian Seaweed

Do your products come in different colours or styles?Each product within a Miva ecommerce store offers the option to add attributes.

A perfect way to display all colours, sizes, prices, styles of your items.

Magic Zoom supports Miva Merchant product attributes out of the box.

Uninstallation

Thanks for trying Magic Zoom on your Miva Merchant site! What did you hope Magic Zoom could do? How can we improve it? Let us know, we're always improving our tools based on customer feedback.

Miva 5.5 PR8 with Image Machine uninstallation

  1. In your Miva admin panel, go to the User Interface > Pages menu.
  2. Find the page Product Display with ID=PROD and click the Edit button on the right.
  3. At the top, click the link "HEAD Tag Content/CSS".
  4. Delete the following lines from the top of template:
    <link rel="stylesheet" href="/magiczoom/magiczoom.css">
<script src="/magiczoom/magiczoom.js"></script>
<script src="/magiczoom/magic-miva-imagemachine.js?tool=MagicZoom"></script>
  5. Click the Update button at the bottom of the page.
  6. Delete the magiczoom folder from this location on your Miva website:
    httpdocs/magiczoom
  7. Magic Zoom is now uninstalled.

Miva 5.5 uninstallation

  1. In your Miva admin panel, go to the Pages menu.
  2. Find the page Product Display with ID=PROD and click the Edit button on the right.
  3. At the top, click the link "HEAD Tag Content/CSS".
  4. Delete the following lines from the top of template:
    <link rel="stylesheet" href="/magiczoom/magiczoom.css">
<script src="/magiczoom/magiczoom.js"></script>
  5. At the top, click the link "Product Display Layout".
  6. Find the code:
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
<a id="mtbMainImage" href="&mvt:product:customfield_values:customfields:ZoomImage;" class="MagicZoom">
</mvt:if>
<img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
<mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
</a>
</mvt:if>
    and replace it with:
    <img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
  7. If you added 2 alternative product images with thumbnails as part of the installation, then reverse Steps 7, 8, 9, 10, 11 & 12 from the Installation instructions > Click the Update button at the bottom of the page.
  8. Delete the magiczoom folder from this location on your Miva website:
    httpdocs/magiczoom
  9. Magic Zoom is now uninstalled.
  1. Jonas Haid, sport-concept.info
    Jonas Haid
    sport-concept.info
  2. Martin Sebborn, toft.org.uk
    Martin Sebborn
    toft.org.uk
  3. Uglysign,
    Uglysign

Magic Zoom for Miva Merchant

Buy now  £29  Download Free Trial

Magic Thumb for Miva Merchant

Optimised for Miva, with beautiful full-screen images.

  • Enlarged images automatically fit within the users screen.
  • The perfect lightbox experience for your customers.
Buy now £29  Download Free Trial
Supported versions
    All latest versions

92%    of users say its the best image lightbox

Downloads   
160+

Key features

Responsive

Fast loading

SEO friendly

Lazy loading

Supports video

Friendly support

One-off payment

Regularly updated

jQuery compatible

Swappable thumbnails

Installation

Miva 5.5 PR8 with Image Machine installation

  1. Download Magic Thumb (free and fully functional demo version).
  2. Unzip the file and upload the magicthumb folder to this location on your Miva website:
    httpdocs/magicthumb
  3. Download this file: magic-miva-imagemachine.js (right click it and "Save as"), then copy that file to the magicthumb folder.
  4. In your Miva admin panel, go to the User Interface > Pages menu.
  5. Find the page Product Display with ID=PROD and click the Edit button on the right.
  6. Insert the following code in the Template section (before tag):
    <link rel="stylesheet" href="/magicthumb/magicthumb.css">
<script src="/magicthumb/magicthumb.js"></script>
<script src="/magicthumb/magic-miva-imagemachine.js?tool=MagicThumb"></script>
  7. Click the Update button at the bottom of the page.
  8. Now your images should zoom! Contact us if you need help.
  9. Buy Magic Thumb To upgrade your free and fully functional trial version of Magic Thumb (which removes the "Trial version" text), buy Magic Thumb. Then overwrite the demo magicthumb.js file with the one from your licensed version.

Miva 5.5 installation

  1. Download Magic Thumb (free and fully functional demo version).
  2. Unzip the file and upload the magicthumb folder to this location on your Miva website:
    httpdocs/magicthumb
  3. In your Miva admin panel, go to the Pages menu.
  4. Find the page Product Display with ID=PROD and click the Edit button on the right.
  5. At the top, click the link "Product Display Layout".
  6. Find the line:
    <img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
    and replace it with:
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
<a id="mtbMainImage" href="&mvt:product:customfield_values:customfields:ZoomImage;" class="MagicThumb">
</mvt:if>
<img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
<mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
</a>
</mvt:if>
  7. The next 4 steps will add 2 alternative product images with thumbnails (so your page will show 3 product images in total). There is no standard method for adding multiple product images on a Miva page, so you may need to adjust these instructions for your site. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView1');"><img src="&mvt:product:customfield_values:customfields:AltView1Thm;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView1;" rev="&mvt:product:customfield_values:customfields:AltView1;" rel="thumb-id: mtbMainImage"><img src="&mvt:product:customfield_values:customfields:AltView1Thm;" class="Mini" width="75"></a>
  8. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView1');"><img src="&mvt:product:customfield_values:customfields:AltView1;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView1;" rev="&mvt:product:customfield_values:customfields:AltView1;" rel="thumb-id: mtbMainImage"><img src="&mvt:product:customfield_values:customfields:AltView1;" class="Mini" width="75"></a>
  9. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView2');"><img src="&mvt:product:customfield_values:customfields:AltView2Thm;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView2;" rev="&mvt:product:customfield_values:customfields:AltView2;" rel="thumb-id:mtbMainImage"><img src="&mvt:product:customfield_values:customfields:AltView2Thm;" class="Mini" width="75"></a>
  10. Find this line:
    <a href="javascript:IM_ZoomPopup('AltView2');"><img src="&mvt:product:customfield_values:customfields:AltView2;" class="Mini" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:AltView2;" rev="&mvt:product:customfield_values:customfields:AltView2;" rel="thumb-id: mtbMainImage"><img src="&mvt:product:customfield_values:customfields:AltView2;" class="Mini" width="75"></a>
  11. Find this line:
    <a href="javascript:IM_ZoomPopup('Zoom');"><img src="&mvt:product:customfield_values:customfields:ZoomThm;" class="MagicThumb" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:ZoomImage;" rev="&mvt:product:customfield_values:customfields:ZoomImage;" rel="thumb-id: mtbMainImage"><img src="&mvt:product:customfield_values:customfields:ZoomThm;" class="Mini" width="75"></a>
  12. Find this line:
    <a href="javascript:IM_ZoomPopup('Zoom');"><img src="&mvt:product:customfield_values:customfields:ZoomImage;" class="MagicThumb" width="75"></a>
    and replace it with:
    <a href="&mvt:product:customfield_values:customfields:ZoomImage;" rev="&mvt:product:customfield_values:customfields:ZoomImage;" rel="thumb-id: mtbMainImage"><img src="&mvt:product:customfield_values:customfields:ZoomImage;" class="Mini" width="75"></a>
  13. Click the Update button at the bottom of the page when finished.
  14. At the top, click the link "HEAD Tag Content/CSS".
  15. Insert the following lines at the top of template:
    <link rel="stylesheet" href="/magicthumb/magicthumb.css">
<script src="/magicthumb/magicthumb.js"></script>
  16. Click the Update button at the bottom of the page.
  17. Enjoy!
  18. Buy Magic Thumb To upgrade your free and fully functional trial version of Magic Thumb (which removes the "Trial version" text), buy Magic Thumb. Then overwrite the demo magicthumb.js file with the one from your licensed version.

Product attributes

Black Maroon Obsidian Seaweed

Do your products come in different colours or styles?Each product within a Miva ecommerce store offers the option to add attributes.

A perfect way to display all colours, sizes, prices, styles of your items.

Magic Thumb supports Miva Merchant product attributes out of the box.

Uninstallation

Thanks for trying Magic Thumb on your Miva Merchant site! What did you hope Magic Thumb could do? How can we improve it? Let us know, we're always improving our tools based on customer feedback.

Miva 5.5 PR8 with Image Machine uninstallation

  1. In your Miva admin panel, go to the User Interface > Pages menu.
  2. Find the page Product Display with ID=PROD and click the Edit button on the right.
  3. At the top, click the link "HEAD Tag Content/CSS".
  4. Delete the following lines from the top of template:
    <link rel="stylesheet" href="/magicthumb/magicthumb.css">
<script src="/magicthumb/magicthumb.js"></script>
<script src="/magicthumb/magic-miva-imagemachine.js?tool=MagicThumb"></script>
  5. Click the Update button at the bottom of the page.
  6. Delete the magicthumb folder from this location on your Miva website:
    httpdocs/magicthumb
  7. Magic Thumb is now uninstalled.

Miva 5.5 uninstallation

  1. In your Miva admin panel, go to the Pages menu.
  2. Find the page Product Display with ID=PROD and click the Edit button on the right.
  3. At the top, click the link "HEAD Tag Content/CSS".
  4. Delete the following lines from the top of template:
    <link rel="stylesheet" href="/magicthumb/magicthumb.css">
<script src="/magicthumb/magicthumb.js"></script>
  5. At the top, click the link "Product Display Layout".
  6. Find the code:
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
<a id="mtbMainImage" href="&mvt:product:customfield_values:customfields:ZoomImage;" class="MagicThumb">
</mvt:if>
<img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
<mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:ZoomImage">
</a>
</mvt:if>
    and replace it with:
    <img src="&mvt:product:image;" alt="&mvt:product:name;" title="&mvt:product:name;" vspace="10" width="300">
  7. If you added 2 alternative product images with thumbnails as part of the installation, then reverse Steps 7, 8, 9, 10, 11 & 12 from the Installation instructions > Click the Update button at the bottom of the page.
  8. Delete the magicthumb folder from this location on your Miva website:
    httpdocs/magicthumb
  9. Magic Thumb is now uninstalled.
  1. Danny DeCillis, ccst.us
    Danny DeCillis
    ccst.us
  2. Tim Francis, c1d.com.au
    Tim Francis
    c1d.com.au
  3. Danie Ludick, webfront.co.za
    Danie Ludick
    webfront.co.za

Magic Thumb for Miva Merchant

Buy now  £29  Download Free Trial

About

These instructions are for Miva Merchant. Use them to add effects to your website including image zoom on hover/mouseover; image lightbox (enlarge image to full screen); and image magnifiers.