Embed 360 spins in Shopify

Shopify logoSince 2006, Shopify has made it easy to create beautiful websites. From day 1, they knew that people get a buzz from a great experience.

That’s why Sirv 360 spins are such a winner on Shopify. They look gorgeous, feel sophisticated and are a doddle to install, thanks to Shopify’s highest-rated image app, Magic Zoom Plus.

Follow the steps below to see how good your product pages and text areas will look.

Add 360 spin to product pages

Customers love a choice of hi-res zoomable images and a 360-degree spin. Experience this demo for yourself.

Follow these steps:

1. Install the free trial Magic Zoom Plus for Shopify app (or buy a full license for $69 USD, one-off payment).

Here’s a quick installation video:

2. Log in to your Sirv account. If you don’t have an account yet, register here.

3. Create a new folder called products:

Create a new folder

4. Inside the ‘products’ folder, create another folder:

New folder button

Name the new folder the same number as the Shopify product number. The product number is unique for each of your Shopify products, shown in your Shopify admin like this:

Shopify product number

5. Upload your 360-degree spin images to the new folder. Simply drag and drop them into your Sirv account or click Upload files to select the set of images from your computer.

Upload images screenshot

6. Go to your Sirv account details page and copy your account name.

Sirv account details

7. Go to the Magic Zoom Plus app in your Shopify admin and paste your Sirv account name into the 360 spins section. Click “Save settings”:

Shopify 360 spin settings

8. Refresh the product page and a 360 icon will appear. Click the 360 icon and the 360 spin will load:

360 spin in Shopify

That’s all!

The icon can be changed to any other image you wish.

To change the default settings of the spin (e.g. direction, sensitivity or watermark), create a profile. Choose from over 40 options, then apply them to your spins by appending ?profile=ProfileName at the end of the spin filepath in the Magic Zoom Plus app.

Add a profile to your spins

Add 360 spins to any text area

You can quickly add spins to other pages too – the front page, blog posts or in descriptive text of product pages.

1. Log in to Shopify and pick any page, blog post or product description.

2. Upload your spin images to your Sirv account. If you don’t have an account yet, register here.

3. Click the spin and you’ll see the HTML embed code:

360 spin screenshot

4. Copy the sirv.js code shown underneath your spin:

360 spin JavaScript code

5. Go to Shopify and click the Show HTML button. Paste the sirv.js code:

360 spin Shopify JS code

6. Copy the div code shown underneath your spin:

360 spin HTML code

7. Go to Shopify and paste the div code.

360 spin Shopify all code

Click Save and enjoy your 360 spin.

It’s that easy!

Note: to show spins in the descriptive text of a product page, ensure that the Magic Zoom Plus app is not installed. Spins can’t be shown in descriptive product text and the product image gallery at the same time.

To uninstall Magic Zoom Plus:

1. Go to: Dashboard > Apps > Magic Zoom Plus and click Restore files:

Restore Shopify template

2. Then click Remove this app:

Remove Shopify app

Get expert help

Our customer support team is always happy to help configure Sirv on your Shopify store. Please contact the support team from your Sirv account.

Was this article helpful?

1 2 3 4 5