Improve your ekmPowershop in 5 minutes.

It's all in the detail.

  • 11 years of regular updates - we stand behind our words.
  • Users love the smooth movement and high quality zoom.

Install | Download

Squarespace is brilliant at making beautiful websites without knowing how to code. It has everything the small business owner needs to quickly create a professional looking website. However, some useful website features are missing, such as image zoom.

Magic Zoom solves the problem of showing beautiful big images on Squarespace websites, by zooming into images on hover. It's a smooth experience and a real WOW factor for visitors who get to see your images in much higher quality.

It's a JavaScript image zoom, which works with or without jQuery, so it'll work perfectly on any website. It's been refined for mobile devices so that you get a great experience when browsing images on iPhones, iPads and other mobile screens.

Easy to install, this image zoom viewer is used on hundreds of Squarespace websites. Join the community - download Magic Zoom today and give your images some love!

Integration instructions

  1. Please note that you will need to enable developer mode. Connect to your website with SFTP, following the Squarespace SFTP instructions.
  2. Create assets folder on Squarespace server Connect to your server. If an assets folder does not already exist, create a new assets folder in the root directory of your Squarespace website.
  3. Download Magic Zoom (free and fully functional demo version).
  4. Upload magiczoom folder to Squarespace server Unzip the file on your computer and SFTP the magiczoom folder to the assets folder (on your server), keeping the file and folder structure intact.
  5. Upload magic-squarespace.js to Squarespace server Download this file - magic-squarespace.js (right click it and save it to your computer), then upload that file to the same assets folder on your server.
  6. Login to your Squarespace admin panel: https://your-site.squarespace.com/config (replace your-site with your domain name).
  7. Add image zoom code to Squarespace header

    In your Squarespace admin panel, go to: Settings > Advanced > Code Injection and insert following code in the Header section:

    <link type="text/css" rel="stylesheet" href="/assets/magiczoom/magiczoom.css"/>
    <script type="text/javascript" src="/assets/magiczoom/magiczoom.js"></script>
    <script type="text/javascript" src="/assets/magic-squarespace.js?tool=MagicZoom"></script>
  8. Save Squarespace changes for image zoom to appearClick the Save button at the top of the page.
  9. That's it! Magic Zoom will now be automatically applied to all your product image galleries.
  10. 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.

Customize

    Magic Zoom can be easily customized thanks to our Wizard!
  1. Go to Magic Zoom Wizard Settings.
  2. Select the settings you require > Click Apply settings button.
  3. Choose your own Squarespace zoom settings Click Global Settings tab (under preview example) > Copy <Script> code.
  4. Save Squarespace for image zoom changes to appear Go to: Settings > Advanced > Code Injection. Paste <Script> code in the Footer field > Save changes.
  5. That's it!

Uninstallation

Thanks for trying Magic Zoom on your Squarespace 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.

  1. Login to your Squarespace admin panel: https://your-site.squarespace.com/config (replace your-site with your domain name).
  2. In your Squarespace admin panel, go to: Settings > Advanced > Code Injection and delete following code from the Header section:

    <link type="text/css" rel="stylesheet" href="/assets/magiczoom/magiczoom.css"/>
    <script type="text/javascript" src="/assets/magiczoom/magiczoom.js"></script>
    <script type="text/javascript" src="/assets/magic-squarespace.js?tool=MagicZoom"></script>
  3. Delete the magic-squarespace.js file from the assets folder (on your server).
  4. Delete the magiczoom folder from the assets folder (on your server).
  5. Magic Zoom is now uninstalled.

Customer reviews

  Rating: 0 (0 reviews)

There are no reviews yet. Be the first!

Submit your review


Thank you!
Your review has been received and will be posted soon.
Used only to verify your review is genuine.

Other Squarespace extensions

Try our other great image effects!

These instructions are for Squarespace. Use them to add image zoom on hover/mouseover effects to your website.